update - pwa laravel vue

Convierta una relación elocuente en el código vue js

Question

Tengo este proyecto que debe obtener valores de una tabla dinámica y una relación de muchos. Cuando uso la sintaxis elocuente obtengo el resultado correcto como se ve aquí:

ReservationController

public function index()
{
    $secSubs = Student::find(1);

    return $secSubs->sectionSubjects;

}

form.blade.php

@inject(''reservation'', ''App/Http/Controllers/ReservationController'')
@foreach( $reservation->index() as $reserved )
<tr>
  <td>{{ $reserved->section->section_code }}</td>
  <td>{{ $reserved->subject->subject_code }}</td>
  <td>{{ $reserved->subject->subject_description }}</td>
  <td>{{ $reserved->schedule }}</td>
  <td>{{ $reserved->subject->units }}</td>
  <td>{{ $reserved->room_no }}</td>
  <td>
    <button class="btn btn-xs btn-danger">Delete</button>
  </td>
</tr>
@endforeach

Sin embargo, quiero hacer uso de la función de vue js para que mi página se rellene automáticamente con el valor que se obtiene como se ve a continuación.

new Vue({
el: ''#app-layout'',

data: {

    subjects: []

},
ready: function(){
    this.fetchSubjects();
},
methods:{

    fetchSubjects: function(){
        var self = this;

        this.$http({
            url: ''http://localhost:8000/reservation'',
            method: ''GET''
        }).then(function (subjects){
            self.subjects = subjects.data;
            console.log(''success'');
        }, function (response){
            console.log(''failed'');
        });
    },

}
});

form.blade.php

<tr v-for="subject in subjects">
  <td>@{{ subject.section.section_code }}</td>
  <td></td>
  <td></td>
  <td></td>
  <td></td>
  <td>@{{ subject.room_no }}</td>
  <td>
     <button class="btn btn-xs btn-danger">Delete</button>
  </td>
</tr>

Como se ve en mi form.blade.php, no puedo obtener el valor de section_code. ¿Me estoy perdiendo de algo?

ACTUALIZACIÓN: SectionSubject Model

class SectionSubject extends Model
{
    protected $table = ''section_subject'';

    public function students()
    {
        return $this->belongsToMany(Student::class, ''section_subject_student'',''section_subject_id'',''student_id''
            )->withTimestamps();
    }

    public function assignStudents(Student $student)
    {
        return $this->students()->save($student);
    }

    public function subject()
    {
        return $this->belongsTo(Subject::class);
    }

    public function section()
    {
        return $this->belongsTo(Section::class);
    }

}

Modelo de estudiante

public function sectionSubjects()
     {
        return $this->belongsToMany(SectionSubject::class,''section_subject_student'', ''student_id'',''section_subject_id'')
        ->withTimestamps();
     }

Modelo de sección

class Section extends Model
{
    public function subjects()
    {
        return $this->belongsToMany(Subject::class)->withPivot(''id'',''schedule'',''room_no'');
    }

    public function sectionSubjects()
    {
        return $this->hasMany(SectionSubject::class);
    }
}

Answer 1

no es problema de laravel o vuejs.

este código

    this.$http({
        url: ''http://localhost:8000/reservation'',
        method: ''GET''
    }).then(function (subjects){
        self.subjects = subjects.data;
        console.log(''success'');
    }, function (response){
        console.log(''failed'');
    });

puedes ver que esta solicitud de ajax recibirá respuesta en json.

y json es más o menos contenido estático. como "Eloquente" dentro del alcance de php es un objeto así que si le pides datos relacionales, ejecutará la llamada y devolverá sus datos relacionales pero json no puede hacer eso.

así que para hacerlo funcionar, necesitas convertir datos relacionales completos y crear una matriz masiva que contenga todos los datos relacionales y luego codificarlos.

por ejemplo :

$user = App/User::with(''roles'')->first();
return $user->toJson();

ahora si devuelve esto, contendrá "user.roles.name" este valor, ya que lo cargamos ansiosamente y lo convertimos en json.

en tu caso:

$subjects = App/Reservation::with(''section'')->all(); 
return $subjects->toJson();

ahora puede usar temas y recorrerlo en "subject.section.section_code" ya que la sección se carga con entusiasmo y se agrega a la matriz y se convierte en json.

Espero que esto resuelva tu problema.