700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > Vue可输入的下拉框

Vue可输入的下拉框

时间:2023-09-08 10:28:22

相关推荐

Vue可输入的下拉框

<template><el-selectv-model="value"placeholder="请选择"clearable:style="{ width: '100%' }"filterableallow-create:filter-method="filterMethod"default-first-option><el-optionv-for="(item, index) in options":key="index":label="item.label":value="item.id"></el-option></el-select></template><script>export default {data() {return {value,options: [{label: "Java开发",id: "1"},{label: "web开发",id: "2"},{label: "c++开发",id: "3"}]};},methods:{filterMethod(val){this.value=val},}};</script><style></style>

在代码中加入以下熟悉便可实现带输入功能的下拉框

filterable 是否可以搜索

allow-create 是否可以创建新选项,也就是是否可以输入,需要配合filterable使用

:filter-method="filterMethod" 自定义的方法

default-first-option 在输入框按回车键,选择第一个匹配项

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。