where to use vue in laravel
hello, i want to know where and how to use vue in laravel, because for now i'am using only ressource/views folder for showing pages, but i don't know the use of ressource/sass and ressource/js , i have tried to search for an answer but i did not find something to really help me to understand how use them from scratch.
for example i want to integrate pagination in tables, i know this needs vue JS , so i have found this code in bootstrap Vue but i don't know where and how to integrate it in my laravel app :
<template>
<div class="overflow-auto">
<b-pagination
v-model="currentPage"
:total-rows="rows"
:per-page="perPage"
aria-controls="myTable"
/>
<p class="mt-3">Current Page: {{ currentPage }}</p>
<b-table
id="myTable"
:items="items"
:per-page="perPage"
:current-page="currentPage"
small
/>
</div>
</template>
<script>
export default {
data() {
return {
perPage: 3,
currentPage: 1,
items: [
{ id: 1, first_name: 'Fred', last_name: 'Flintstone' },
{ id: 2, first_name: 'Wilma', last_name: 'Flintstone' },
{ id: 3, first_name: 'Barney', last_name: 'Rubble' },
{ id: 4, first_name: 'Betty', last_name: 'Rubble' },
{ id: 5, first_name: 'Pebbles', last_name: 'Flintstone' },
{ id: 6, first_name: 'Bamm Bamm', last_name: 'Rubble' },
{ id: 7, first_name: 'The Great', last_name: 'Gazzoo' },
{ id: 8, first_name: 'Mr', last_name: 'Slate' },
{ id: 9, first_name: 'Pearl', last_name: 'Slaghoople' }
]
}
},
computed: {
rows() {
return this.items.length
}
}
}
please can you explain to me how can i integrate this code in my laravel app, because i need this and this will help me to understand how to use sass and js folder in ressource in laravel?, thank you
@kinsaw88 what you are referencing is a Vue component, which you would need to register as a component for Vue to mount.
Instead of trying to go into great lengths to explain, I would suggest watching the entire free series on Vue. You'll be taken by the hand and shown every step of the way.
Please or to participate in this conversation.