el-select 选值以后回显NAN
时间: 2024-01-06 09:25:16 浏览: 328
el-select选值以后回显NAN的问题可能是由于数据类型不匹配导致的。请确保你的选项数据中的value值与v-model绑定的数据类型一致。另外,还需要检查是否正确设置了value-key属性。
以下是一个示例代码,演示了如何使用el-select实现选值回显:
```html
<template>
<el-select v-model="selected" value-key="id">
<el-option value="" label="请选择" />
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</template>
<script>
export default {
data() {
return {
selected: '', // 选中的值
options: [
{ id: 1, name: '选项1' },
{ id: 2, name: '选项2' },
{ id: 3, name: '选项3' }
]
};
}
};
</script>
```
在上述示例中,options数组中的每个对象都有一个id属性,我们将其作为value值传递给el-option组件。v-model绑定的是selected变量,它会保存选中的值的id。这样,当选中一个选项时,selected的值就会更新为对应的id,从而实现了选值回显。
阅读全文