Passa la matrice alla vista Laravel e usa quella matrice come puntello VueJS

Question

Ho una variabile di matrice $screenshots che sto cercando di passare alla mia vista Laravel. Di solito, userei lo @foreach e faccio un ciclo attraverso l'array, ma voglio passare l'array completo a un componente Vue definendolo come supporto. Voglio fare questo in modo che possa scorrere l'array nel componente. Sto ottenendo l'errore htmlentities() expects parameter 1 to be string, array given.

Qual è il modo corretto per farlo con VueJS e Laravel?

Ecco il mio modello di lama:

@section('content') 

    <ticket-edit id="edit-ticket" single-ticket="{{ $ticket }}" screenshots="{{ $files }}"> 

    </ticket-edit> 

@endsection 

Qui è la mia componente personalizzato (file diverso):

<script> 
    export default { 

     template: '#edit-ticket-template', 

     props: ['SingleTicket', 'screenshots'], 

     data: function() { 
      return { 
       ticket: [], 
       screenshots: [] 
      }; 
     }, 

     methods: { 
      getTicket() { 
       return this.ticket = JSON.parse(this.SingleTicket); 
      }, 

      getScreenshots() { 
       return this.screenshots = JSON.parse(this.files); 
      }, 

      createNotes: function() { 
       var ticketNotes = $('.summernote'); 
       ticketNotes.summernote({ 
        height: 260, 
        toolbar: [ 
         ['style', ['bold', 'italic', 'underline', 'clear', 'strikethrough']], 
         ['fontsize', ['fontsize']], 
         ['para', ['ul', 'ol']], 
        ] 
       }); 
      } 
     }, 

     created: function() { 
      this.getTicket(); 
      this.getScreenshots(); 
     }, 

     ready: function() { 
      this.createNotes(); 
     } 

    } 
</script> 

EDIT: Quando sto aggiunta di allegati, sto usando json_encode per codificare il percorso per gli allegati. Poi quando li ho recuperare, corro json_decode nel mio modello in questo modo $files = json_decode($ticket->screenshots); Quindi il mio controller si presenta così:

public function edit($sub_domain, $id) 
{ 
    $ticket = Ticket::find($id); 
    $files = json_decode($ticket->screenshots); 

    return view('templates.tickets-single', compact('ticket', 'files')); 
} 

Answer 1

Questo funziona - è stato difficile trovare questa risposta sul web, quindi spero che aiuti! Devi legarlo.

<edit-ticket-template 
     v-bind:SingleTicket="{{ json_encode($ticket) }}" 
     v-bind: screenshots ="{{ json_encode($files) }}" 
    > 
    </edit-ticket-template> 

Sì non credo che è necessario json_encode il biglietto di sola andata, ma si ottiene il punto.

Answer 2

Penso Lama chiama htmlentities() automaticamente quando si scrive {{ $ticket }}. Poiché $ticket non è una stringa, si sta verificando un errore. Prova {{ json_encode($ticket) }}

Answer 3

Si dovrebbe usare {!! json_encode($ticket) !!}}