在 JavaScript 中,对象可以选择扩展值,如下所示:
const payload = {
name: "Joseph",
...(isMember && { credential: true })
};
在 React 中,JSX 可以像这样可选地传递 props:
<Child {...(editable && { editable: editableOpts })} />
现在在Vue中,我如何实现可选v-model
?
我有一个像这样的文本区域
<template>
<textarea v-model="textValue"> <!-- How can I optional bind v-model? -->
</template>
如何实现可选绑定v-model
?
我想这样做是因为我想在发生错误时在该文本区域上显示警告。
当错误发生时,textarea显示警告并清除输入(v-model
)
正确的方法是使用计算变量的 get 和 set 属性
<template>
<textarea v-model="compVal" />
</template>
<script>
export default {
data () {
return {
valueTrue: 'hello',
valueFalse: 'bye',
selected: false
}
},
computed: {
compVal: {
get () {
if (this.selected) {
return this.valueTrue
} else {
return this.valueFalse
}
},
set (val) {
if (this.selected) {
this.valueTrue = val
} else {
this.valueFalse = val
}
}
}
}
}
</script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)