首页 文章

如何使用VueJs Laravel获取关系数据

提问于
浏览 次
2

如何使用vuejs在表格中显示用户名？

我有我的用户和帖子表与关系集 . 用户有很多帖子，帖子属于用户 .

在我的Posts.vue模板中，我现在可以显示post表数据：

<tr v-for="post in posts">
    <td>{{ post.id }}</td>
    <td>{{ post.title }}</td>
    <td>{{ post.body | snippet }}</td>
</tr>

脚本如下所示：

<script>
    export default {
        data(){
            return{
                posts: []
            }
        },

        methods: {
            showPosts(){
                axios.get('/app/posts').then(response => {
                    this.posts = response.data.posts;
                });
            }
        },
       mounted(){
            this.showPosts();
       }
    }
</script>

我的PostController在索引函数中看起来像这样

public function index()
 {
    //
    $posts = Post::all();
    return response()->json([
        'posts' => $posts,
    ], 200);
 }

由于我在posts表中有user_id，如何使用vuejs在我的表中显示用户名？

vuejs2 laravel-5.6

2 回答

  • 5

    所以我从Laravel docummentation中发现我可以在我的控制器中传递“with”函数，如下所示：

    $posts = Post::with('user')->get();

    这给了我帖子和该帖子的用户数据，这允许我这样访问：

    {{ post.user.name }}
    回复于
  • 0

    感谢您记录这一点，这肯定有帮助 .

    我正在使用laravel进行关系链接，但还没有使用api，但是使用 with() 方法，在我的vuejs代码中引用关系数据是一件轻而易举的事 .

    Not Working: Laravel

    public function index()
{
  if (request()->q){
    $search = request()->q;

    $searches =  User::whereHas('doctor') 
      ->where(function ($query) use ($search){
        $query->where('name', 'like', "%$search%")
              ->orWhere('email', 'like', "%$search%");
      })->paginate(5);
  }

  return $searches;
}

    Working: Laravel

    public function index()
{
  if (request()->q){
    $search = request()->q;

    $searches =  User::with('doctor')->whereHas('doctor') 
      ->where(function ($query) use ($search){
        $query->where('name', 'like', "%$search%")
              ->orWhere('email', 'like', "%$search%");
      })->paginate(5);
  }
  return $searches;
}

    Usage: VueJs

    ... <span v-text="search.doctor.specialty"></span>

    回复于

相关问题