解决Vue问题（[Vue warn] Avoid mutating a prop…Prop being mutated list (found in component )）
【解决Vue问题（[Vue warn] Avoid mutating a prop…
Prop being mutated list (found in component )）】Main.js文件如下：
Vue.component('task', {
template: '#task-template',
props: ['list'],
created() {
this.list = JSON.parse(this.list);
}
});
new Vue({
el: '.container'
})
Vue报错：
vue.js:2574 [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "list" (found in component )解决办法：
在本地修改一个prop，正确的方式是在数据声明中使用prop值作为初始值的字段，然后修改副本，如下代码：
Vue.component('task', {
template: '#task-template',
props: ['list'],
data: function () {
return {
mutableList: JSON.parse(this.list);
}
}
});
要注意的是，使用相同的prop和data是错误的，也就是下面的方式是错误的：
data: function () { return { list: JSON.parse(this.list) }推荐阅读
- 解决Vue错误（[Vue warn] Error in render RangeError Invalid array length）
- 解决Vue问题（Uncaught ReferenceError Vue is not defined）
- 解决vue-cli安装错误（npm ERR! A complete log of this run can be found in npm ERR!）
- 前端CSS（实现CSS集合）
- PHP date_default_timezone_set()函数用法详解
- 算法设计（在按行排序的矩阵中找到中位数）
- PHP atanh()函数用法介绍
- PHP fread()函数用法介绍
- 算法设计（检查单链表是否为回文的函数）