【vue】props里的值赋值给data
props赋值data
·
相信大家都知道vue的组件传值
如果不懂可以看一下这篇文章
文章地址
我要解决的是传过来的值如何通过vue生命周期函数在方法里使用,今天我解决了这个问题花了一两个小时,原本以为是监听器和计算属性没有起作用,原来是生命周期函数的原因
原来的函数
watch:{
blogId(val){
//当a值变化时
this.id = val
}
},
methods: {
loadMessage() {
console.log("loadMessage()"+this.id)
this.$axios.get("/comments/preview/"+this.id).then(res => {
console.log(res.data)
if(res.data.code==200){
this.messages = res.data.data
}
})
},
cancel() {
this.dialogFormVisible = false;
this.entity = {};
},
reReply(id) {
this.dialogFormVisible = true;
this.entity.parentId = id;
},
reply() {
this.entity.content = this.entity.reply;
this.save();
},
save() {
if (!this.user.username) {
this.$message({
message: "请登录",
type: "warning"
});
return;
}
if (!this.entity.content) {
this.$message({
message: "请填写内容",
type: "warning"
});
return;
}
this.$axios.post("/comments/addpreview", this.entity).then(res => {
if (res.code === '0') {
this.$message({
message: "评论成功",
type: "success"
});
} else {
this.$message({
message: res.msg,
type: "error"
});
}
this.entity = {}
this.loadMessage();
this.dialogFormVisible = false;
})
},
del(id) {
this.$axios.delete("/comments/delete" + id).then(res => {
this.$message({
message: "删除成功",
type: "success"
});
this.loadMessage()
})
}
},
created() {
this.user = sessionStorage.getItem("userinfo") ? JSON.parse(sessionStorage.getItem("userinfo")) : {};
this.loadMessage();
},
我这里将这个loadmessage方法写入了created里在创建这个页面时,从父组件加载数据就加载不进了,axios函数就接受不到这个值
解决方法
created() {
this.user = sessionStorage.getItem("userinfo") ? JSON.parse(sessionStorage.getItem("userinfo")) : {};
},
updated() {
this.loadMessage();
}
直接在updated函数里写这个方法,因为这个数据更新了再能挂载
更多推荐
已为社区贡献1条内容
所有评论(0)