laravel - 很难从 Laravel 集合中获取 Vuejs 中的关联表记录
问题描述
我正在使用 Vuejs 和 Laravel 构建一个实时提要应用程序,但我发现很难从 Vuejs 中的集合中获取关联数据,是否可以轻松获取这些数据?
这是我的尝试:
<div class="sl-item" v-for="post, index in posts">
<a href="javascript:void(0)">
<div class="sl-content">
{{post}}
<br>
------------------------
<br>
{{getUser(post.user_id)}}
</div>
</a>
</div>
这是我打算检索用户记录的方法:
methods: {
getUser (id)
{
return axios.get("/user/getUser/" + id)
.then(response => {
console.log(response.data);
return response.data;
});
}
},
我可以记录我在控制台中获得的内容,但我无法显示或访问从我的方法返回的内容。
有没有其他更简单的方法来实现这一点?
解决方案
您从集合中获取所有数据。这就是为什么您还会在对象中获得不需要的数据
在您当前的情况下(无需更改控制器脚本),您可以像这样访问这些数据:
public function index(Request $request)
{
if ($request->ajax()) {
return Post::with(['user' => function($query){
$query->select(['id', 'name'])
}])
->select(['id', 'title', 'description'])
->get;
}
}
如果您在控制器中执行此操作,那么在您的 vue 文件中,
data:function(){
return{
posts: [],
};
},
methods: {
getPosts ()
{
return axios.get("/posts")
.then(response => {
this.posts = response.data;
});
}
},
在组件中:
<div class="sl-item" v-for="post, index in posts">
<a href="javascript:void(0)">
<div class="sl-content">
{{post.title}}
<br>
------------------------
<br>
{{ post.user.name }}
</div>
</a>
</div>
推荐阅读
- python - 如何在仍然访问完整目录的同时返回目录的最后一部分?特金特
- oracle - 将数据 clob 到多个列中
- python - Pycharm“没有名为 REPORT.py 的模块”,但是它存在并且可以工作。但是之后
- linux - 从多个匹配项中识别重叠范围的最小值和最大值
- list - 飞镖中带有条件的列表长度
- sapui5 - 如何更改 ui5 中 smartFilterBar 的默认变体名称(即“标准”到“自定义”)?
- java - 无法执行 android:onClick 错误的方法
- c# - 列表中的项目计数未按预期工作
- tfs - TF14092:此项的父项有一个挂起的删除,必须先签入
- python - TypeError:参数必须是字符串或只读缓冲区,而不是字节数组