el-input 税率设置
时间: 2023-10-08 14:10:33 浏览: 39
在el-input中设置税率的格式,可以通过以下方式实现:
1. 使用`v-model`绑定一个计算属性,该属性将输入的数值格式化为带有两位小数的百分比形式。
2. 使用`toFixed(2)`方法将计算属性的值保留两位小数。
3. 在`@input`事件中,将输入的数值再次格式化为带有两位小数的百分比形式。
以下是具体的代码实现:
```html
<template>
<div>
<vxe-column field="taxRate" title="税率%" min-width="120">
<template #edit="scope">
<vxe-input
size="mini"
v-model="formattedTaxRate"
:digits="2"
type="float"
:controls="false"
@input="onInput"
/>
</template>
</vxe-column>
</div>
</template>
<script>
export default {
data() {
return {
formattedTaxRate: "",
};
},
computed: {
formattedTaxRate() {
return (this.taxRate * 100).toFixed(2);
},
},
methods: {
onInput() {
this.formattedTaxRate = (this.taxRate * 100).toFixed(2);
},
},
};
</script>
```
在这个示例中,我们创建了一个名为`formattedTaxRate`的计算属性,它将输入的税率值乘以100并保留两位小数。然后,我们将这个计算属性绑定到`v-model`,并在`@input`事件中更新它。这样,当用户在输入框中输入税率时,它将自动格式化为带有两位小数的百分比形式。<span class="em">1</span><span class="em">2</span><span class="em">3</span>