目录Ant Design of Vue select框获取key和name我的记录Ant Design Vue使用select出现的问题1.select下拉菜单滚动条滚动后,自动弹回
加入label-in-value这个属性
<a-fORM-item label="分类">
<a-select
placeholder="请选择分类"
style="width: 100%"
label-in-value
v-decorator="['knowledgeunit', { rules: [{ required: true, message: '请选择分类' }] }]"
>
<a-select-option v-for="(calssitem, index) in classflyData" :key="index" :value="calssitem.Code">
{{ calssitem.Name }}
</a-select-option>
</a-select>
</a-form-item>
获取到的value 就会变成 {key: 1, lable: '名字'} 的形式
获取值的时候可以这样获取
this.addResourceForm.validateFields((err, values) => {
if (err && this.newChange.length > 0) {
return
}
const saveObj = {}
saveObj.knowledgeunit = values.knowledgeunit.key // 获取的值
saveObj.source = values.knowledgeunit.label // 获取的名称
})
还有一种方法
你如果想获取怎个对象,怎么获取呢?
<a-form-item label="分类">
<a-select
placeholder="请选择分类"
style="width: 100%"
@change="onChange"
v-decorator="['knowledgeunit', { rules: [{ required: true, message: '请选择分类' }] }]"
>
<a-select-option v-for="(calssitem, index) in classflyData" :key="index" :value="calssitem.Code">
{{ calssitem.Name }}
</a-select-option>
</a-select>
</a-form-item>
加一个onChange方法,根据下标获取对应的对象
onChange (item) {
const obj = this.list[item]
console.log(obj)
}
解决方法:
a-select-option 使用v-for渲染时,key值不能重复或者为null
解决方法:
以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。
--结束END--
本文标题: Ant Design of Vue select框获取key和name的问题
本文链接: https://www.lsjlt.com/news/150309.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-01-12
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0