在VUE el-form表单中,el-input中根据后端传来的数字,进行判断显示不同的文本进行回显
时间: 2024-02-01 15:15:37 浏览: 28
你可以在 el-input 中使用 v-model 绑定一个数据,然后使用 computed 计算属性根据后端传来的数字来返回不同的文本,最后将计算属性的值赋给 v-model 即可。
示例代码如下:
```html
<template>
<div>
<el-form ref="form" :model="form">
<el-form-item label="数字文本">
<el-input v-model="displayText"></el-input>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
data() {
return {
form: {
number: 1 // 假设后端传来的数字为 1
}
}
},
computed: {
displayText() {
switch (this.form.number) {
case 1:
return '文本一'
case 2:
return '文本二'
case 3:
return '文本三'
default:
return ''
}
}
}
}
</script>
```
在上述代码中,我们使用了一个 computed 计算属性 `displayText`,根据后端传来的数字来返回不同的文本。然后将 `displayText` 绑定到 el-input 的 v-model 上,这样就可以实现根据后端传来的数字来显示不同的文本。