当我想在二传手"avoid mutating prop error"节目中更改道具时

Question

在我传递一个数组作为prop并试图在setter (in computed)中更改prop后，它显示了"避免改变prop";错误。下面是我的代码:

export default {
props: {
links: {
type: Array,
default: () => {
return [];
},
required: true
},
},
data() {
return {
data: {}
};
},
computed: {
links_data: {
get() {
return this.links
},
set(value) {
this.$emit('update:links', {...this.links = value})
}
}
},
methods: {
// Add new link
addNewLink() {
axios.post(api, this.data)
.then(res => { this.links_data = res.data.links })
.catch(error => {console.log(error)})
},
// Post delete
deleteLink() {
axios.delete(api)
.then(res => { this.links_data = res.data.links })
.catch(error => {console.log(error)})
},
}
};

有人知道为什么我得到这个错误吗?

Answer 1

设置错误

this.$emit('update:links', {...this.links = value})

1. 你已经使用了this.links为赋值我的意思是你直接尝试分配值在this.links所以它是变异错误的原因。

2. 你正在尝试传递对象到this.links而不是数组虽然链接道具类型Array.

所以试着解决以上两个问题，然后我想它会很好。

就像下面那样替换setter $emit，

this.$emit('update:links', [...value])

或

this.$emit('update:links', value)

希望它能解决你的问题。