search

classe59 / 02-imdb

0 stars 0 forks source link

Creazione componente VueJS per mostrare una lista dei film #7

Open DonnieRich opened 2 years ago

DonnieRich commented 2 years ago

Verificare che sia stato installato anche axios con lo scaffolding, altrimenti lanciare il comando per installare la dipendenza:

npm install axios --save-dev

Dipendenze

DonnieRich commented 2 years ago

La gestione dei componenti di VueJS è praticamente identica a quanto facciamo quando usiamo Vue CLI. L'unica differenza è che ci troviamo all'interno di Laravel e quindi dobbiamo gestire i file compilati di JS tramite webpack.mix.js.

Quello che invece scriviamo all'interno dei singoli componenti non varia rispetto a quello che abbiamo fatto con i progetti realizzati tramite Vue CLI.

In una view di Blade avremo un elemento HTML con ID app in cui monteneremo tutta la struttura dei componenti di Vue.

All'interno di uno dei nostri componenti scriveremo il codice necessario ad interrogare la nostra rotta API che ci restituisce la lista dei film.

Esempio:

axios.get('/api/movies')

Ovviamente possiamo usare lo slug (al posto del $movie->id usato nel back-office) per recuperare il singolo film.