在商店中,我有一个更新一些数据的操作,该操作如下所示:
setRoomImage({ state }, { room, index, subIndex, image }) {
state.fullReport.rooms[room].items[index].items[subIndex].image = image;
console.log(state.fullReport.rooms[room].items[index].items[subIndex])
},
Run Code Online (Sandbox Code Playgroud)
因为所有这些数据都是动态的,所以我必须动态更改嵌套值并且不能直接对属性进行硬编码。数据如下所示:
fullreport: {
rooms: {
abc: {
items: [
{
type: "image-only",
items: [
{
label: "Main Image 1",
image: ""
},
{
label: "Main Image 2",
image: ""
}
]
}
]
}
}
}
Run Code Online (Sandbox Code Playgroud)
当我分派动作时,在控制台中我可以看到子属性的值image已成功改变,但是如果我从 Chrome 中的 Vue DevTools 访问 VueX 存储,我看到该值在那里没有改变。这是控制台输出:
拜托,有人能告诉为什么会这样吗?据我所知,数据正在成功更改,但不知何故状态没有显示它,因此我的组件不会重新渲染。
我也尝试使用Vue.set而不是简单的赋值,但仍然没有运气:(
Vue.set(
state.fullReport.rooms[room].items[index].items[subIndex],
"image",
image
);
Run Code Online (Sandbox Code Playgroud)
按照David Gard 的回答,我尝试了以下操作:
我也在使用 Lodash _ …
我正在使用 Laravel API 和 VueJS 前端应用程序。我发送axios POST电话以及用户提供的有关他自己的一些信息。在后端,我获取该数据并更新 MySQL 数据库中的用户记录。
这是我的后端代码:
$user = User::where(['logintoken' => $request->login_token, 'remember_token' => $request->remember_token])->first();
if (!$user) {
$status = 404;
$response = ['status' => false, 'message' => 'User not found.'];
} else {
$affectedRows = $user->update([
'country' => $request->input('country'),
'city' => $request->input('city'),
'state' => $request->input('state'),
'dob' => $request->input('dob'),
'language' => $request->input('language'),
'street' => $request->input('street'),
'house' => $request->input('house'),
'avatar' => $request->input('avatar'),
'birthplace' => $request->input('birthplace'),
'type' => $request->input('userType'),
'bio' => $request->input('bio'),
'zip' => $request->input('zip'),
'has-completed-profile' => …Run Code Online (Sandbox Code Playgroud)