我在通过道具从VueJS组件中访问雄辩者的关联时遇到问题。
因此，要将模型对象传递给vue组件，如下所示：
评论模型
public function post()
{
return belongsTo('App\Post');
}
评论控制器
$comments = Comment::all()
return view('comments', ['comments' => $comments);
评论刀片
<comment-index :comments="{{ $comments }}"></comment-index>
组件视图
<template>
<div>
<table>
<tr v-for="comment in comments">
<td>{{ comment.message }}
<td>{{ comment.post.title }} // post is undefined
</tr>
</table>
</div>
</template>
<script>
export default {
props: ['comments']
}
</script>
但是，如果我在控制器中循环发布并转储该帖子，则该帖子将显示在vue模板中：
$comments = Comment::all()
foreach($comments as $comment) {
dump($comment->post->title);
}
return view('comments', ['comments' => $comments);
由于您在上使用Vue，因此在您通过控制器访问Vue时comment.blade，post它不会被延迟加载$comment->post->title。
来自Laravel docs：
当访问Eloquent关系作为属性时，关系数据是“延迟加载”的。这意味着直到您首次访问该属性，关系数据才被实际加载。
由于您正在使用Vue（客户端）进行访问post，因此延迟加载将无法进行，因此在您按如下方式访问它时不会进行加载：{{ comment.post.title }}导致其价值为undefined。
为了解决这个问题，您可以post通过执行此操作来渴望加载评论。
$comments = Comment::with('post')->get();
另外，如果您不延迟加载评论的帖子并且评论变大，则可能会导致N + 1查询问题导致性能问题。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句