对点BUG---选择框编辑显示value

  <el-form-item label="客户意向" prop="intention">
                    <el-select v-model="POForm.intention" placeholder="请选择" popper-class="sel-dropdown" class="sel">
                        <el-option v-for="item in intentionOptions" :key="item.value" :label="item.label" :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
 intentionOptions: [{
                        label: "一定录用",
                        value: 1
                    },
                    {
                        label: "优先录用",
                        value:2
                    },
                    {
                        label: "可以录用",
                        value: 3
                    }
                ],

这样编辑时传过来的value值是1 下拉框显示的也是1
这样修改intentionOptions: [{
label: "一定录用",
value: "1"
},
{
label: "优先录用",
value:"2"
},
{
label: "可以录用",
value: "3"
}
],

value跟传过来的值不对应 “1” 不等于1 所以渲染出错

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
el-select选择器是Vue2.0 Element-UI中的一个组件,用于创建下拉选择。当选择的内容发生改变后,会触发selectMethod事件。 在element-ui V2.2.3中,有候el-select选择器无法正确显示选中的内容。为了解决这个问题,可以尝试以下方法: 1. 确保options选项中的数据格式正确,每个选项都有label和value属性。如果数据格式不正确,选择器就无法正常显示选中的内容。 2. 可以更新element-ui的版本到最新的稳定版本,以确保解决了可能存在的bug。 3. 如果以上方法都无效,可以尝试使用其它类似的组件或自定义一个下拉选择来替代el-select选择器。 以下是一个示例代码,用于创建一个el-select选择器,并显示选中的内容: ```html <template> <div> <el-select v-model="selectedValue" placeholder="请选择" @change="selectMethod"> <el-option v-for="(item, index) in options" :key="index" :label="item.label" :value="item.value"></el-option> </el-select> <div>选中的内容: {{selectedValue}}</div> </div> </template> <script> export default { data() { return { options: [ { label: '选项1', value: 'option1' }, { label: '选项2', value: 'option2' }, { label: '选项3', value: 'option3' } ], selectedValue: '' }; }, methods: { selectMethod() { // 处理选中内容改变后的逻辑 } } }; </script> ``` 在这个示例代码中,我们使用了el-select选择器和el-option组件来创建一个下拉选择,并在选项改变触发了selectMethod方法。选中的内容会通过v-model绑定到selectedValue属性上,然后显示在页面上。你可以根据自己的需求修改选项的label和value属性,并在selectMethod方法中处理选中内容改变后的逻辑。<span class="em">1</span><span class="em">2</span> #### 引用[.reference_title] - *1* [vue中使用el-select选择器组件,基础组件用法和多选组件搭配使用](https://blog.csdn.net/weixin_56818823/article/details/125506475)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* [vue2.0 element-ui中el-select选择器无法显示选中的内容(解决方法)](https://download.csdn.net/download/weixin_38685694/12953562)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值