有没有办法为.定义选中和未选中的值?现在VUE将模型设置为true/false,这是有意义的,但在实际应用程序中,数据格式类似于'1‘=> true和''=>false。如何在VUE中实现这一点?
发布于 2018-05-31 09:01:50
您可以使用true-value
和false-value
https://vuejs.org/v2/guide/forms.html#Checkbox-1
<input
type="checkbox"
v-model="toggle"
true-value="yes"
false-value="no"
>
// when checked:
vm.toggle === 'yes'
// when unchecked:
vm.toggle === 'no'
发布于 2015-08-20 23:51:47
不知道你到底需要什么,但是,正如你所说,如果你这样做了:
{{ boxtest }}
<input type="checkbox" v-model="boxtest"/>
当您选中或取消选中该框时,Boxtest将显示为'true‘或'false’。
如果你确实需要转换它,你可以像这样做:
{{ boxtest ? 1 : '' }}
发布于 2020-09-18 16:29:46
如果您需要在组件中包装一个字段,则必须稍微修改代码。
<template>
<div class="flex items-center h-5">
<input
@input="$emit('input', reversedValue)"
:id="id"
:value="value"
type="checkbox"
:checked="checked"
/>
</div>
</template>
<script>
export default {
props: {
value: [Boolean, String, Number],
trueValue: {
type: [Boolean, String, Number],
default: true
},
falseValue: {
type: [Boolean, String, Number],
default: false
},
},
computed: {
reversedValue() {
return this.value === this.trueValue ? this.falseValue : this.trueValue;
},
checked() {
return this.value === this.trueValue;
}
}
};
</script>
https://stackoverflow.com/questions/32119653
复制相似问题