我想知道我们可以在这里简化数据和方法的使用,这样我们就不需要像这样一一定义了吗?我们可以使用迭代或其他方式吗?
export default {
data() {
return {
key1 = false,
key2 = false,
key3 = false,
.....
}
},
methods:{
onClick1 () {
key1 = true
},
onClick2 () {
key2 = true
},
onClick3 () {
key2 = true
},
.....
},
.....
}
组件上
<myComp @click="onClick1">One</myComp>
<myComp @click="onClick2">Two</myComp>
<myComp @click="onClick3">Three</myComp>
.....
任何帮助都会非常有帮助,在此先感谢!
最佳答案
首先,数据属性返回一个对象,所以你不能在那里定义变量。
data() {
return {
key1: false,
key2: false,
key3: false,
...
}
}
在某些情况下,您可以直接在点击事件上更改数据,例如:
<myComp @click="key1 = true">One</myComp>
<myComp @click="key2 = true">Two</myComp>
<myComp @click="key3 = true">Three</myComp>
这不是最佳做法,但在某些情况下会有所帮助。
在大多数情况下,您需要使用回调,例如“Majed Badawi”在此处制作的示例。
关于javascript - vuejs中简化数据和方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70606925/