2

Tengo tres tablas, la primera es la tabla Post, la segunda es la tabla Tag y la tabla intermedia post_tag, es una relación muchos a muchos entre la tabla Post y Tag, también tengo una vista llamada post.blade.php donde se muestran los post existentes con sus etiquetas.

El problema radica en cuando implemento Vuejs, creo un componente donde muestro los post pero no puedo ver los tag. Cuando envió los datos desde el controlador y este es leído por la parte de vue con axios, me muestra solo el array de la consulta pero no me lo relaciona con la tabla intermedia.

myPost.vue

<template>
 <div id="mypost">
   <table>
     <thead>
       <tr>
         <th>Título</th>
         <th>Tags</th>
       </tr>
     </thead>
   <tbody>
      <tr v-for="post in posts" :key="post.id">
        <td>{{ post.title }}</td>
        <td v-for="tag in post">{{ tag.name }}</td>
      </tr>
    </tbody>
  </table>
 </div>
</template>

<script>
  export default {
    name: 'myevent',
    created () {
        this.getEvent();
    },
    data () {
        return {
            allMyPost: []
        }
    },
    methods: {
        getEvent () {
            var urlMyAllPost = '/dashboard/myPost';
            axios.get(urlMyAllPost)
                .then(response => {
                    console.log(response.data);
                    this.allMyPost = response.data;
                })
                .catch(e => {
                    console.log(e);
                })
        }
    }
  }
 </script>

PostController

public function myPost()
{
    $allMyPost = Post::where('user_id', '=', Auth::user()->id)
                        ->where('status', '!=', 'RECHAZADO')
                        ->orderBy('created_at', 'DESC')
                        ->get();

    return $allMyPost->toJson();
}

Como comentaba, las relaciones de las tablas funcionan, se muestran los tag en una vista blade, pero cuando hago una vista de Vue component, entonces los tag no aparecen pero si todo lo otro.

¿Alguna idea para mostrar los tag en una vista Vue?, pienso quizás que hay que arreglar la consulta en el controlador pero como soy nuevo no tengo mucho dominio en Laravel 5.6)

2 respuestas 2

5

Creería que debes incluir la relación en la consulta con with():

$allMyPost = Post::with('tags')
    ->where('user_id', '=', Auth::user()->id)
    ->where('status', '!=', 'RECHAZADO')
    ->orderBy('created_at', 'DESC')
    ->get(); 

Para acceder a los tags de un post en Vue, sería algo así:

<td v-for="tag in post.tags">{{ tag.name }}</td
4
  • Hago la prueba enseguida
    – Felipe
    Commented el 7 abr. 2018 a las 5:04
  • que salvada! muchas gracias, funcionó a la primera!
    – Felipe
    Commented el 7 abr. 2018 a las 5:09
  • Sí la respuesta te sirvió, puedes marcarla como aceptada
    – Shaz
    Commented el 7 abr. 2018 a las 5:11
  • Sip, estaba esperando el tiempo de 2 minutos que te hace esperar stack
    – Felipe
    Commented el 7 abr. 2018 a las 5:14
0

La respuesta correcta es la de https://es.stackoverflow.com/users/73/shaz pero creo que en VUEJS 2.x en la vista debe ir sin el v-for en la etiqueta. Ejemplo:

<td>{{ post.tags.name }}</td>
0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.