<el-form-item label="方法名称">
<el-autocomplete popper-class="my-autocomplete"
v-model="customForm.MethodName"
:fetch-suggestions="querySearchMethod"
placeholder="请输入方法名称"
:disabled="IsDisabled"
@select="((item)=>selectMethodChange(item))">
<template slot-scope="{ item }">
<div class="name">{{ item.value }}</div>
</template>
</el-autocomplete>
</el-form-item> // 方法
querySearchMethod(queryString, cb) {
let that = this;
var solList = []
that.MethodOptionItems.forEach(item => {
solList.push({ 'label': item.value, 'value': item.label })
}) var results = queryString
? solList.filter(this.createFilterMethod(queryString))
: solList;
// 调用 callback 返回建议列表的数据
cb(results);
},
createFilterMethod(queryString) {
let that = this;
var solList = that.MethodOptionItems;
return solList => {
return (
//solList.label.toLowerCase().indexOf(queryString.toLowerCase()) === 0
solList.label
);
};
},
handleSelectMethod(item) {
console.log(item);
},

Vue中-下拉框可以选择可以填写的更多相关文章

  1. VUE 单选下拉框Select中动态加载 默认选中第一个

    <lable>分类情况</lable> <select v-model="content.tid"> <option v-for=&quo ...

  2. vue获取下拉框值

    vue获取下拉框的值,用vue-modle,只有点击下拉框的值才会赋值到下拉框中,初始时下拉框没有数据,而改用$event就不会出现这样的问题,下面看代码以及图解: v-model解决方式: < ...

  3. vue select下拉框绑定默认值

    vue select下拉框绑定默认值: 首先option要加value值,以便v-model可以获取到对应选择的值 一.当没有绑定v-model,直接给对应的option加selected属性 二.当 ...

  4. vue实现下拉框全选和输入匹配

    实际项目中的一个需求: 点击文本框,弹出带有复选框的选项,然后获取选中项的数据,传给后面的一个功能.在文本框输入内容,也会动态的匹配下拉列表,并且列表带有全选功能. 朴素的效果图: 我选择了用vue实 ...

  5. vue自定义下拉框组件

    创建下拉框组件 Select.vue <template> <div class="selects"> <div :class="{sele ...

  6. vue+element下拉框样式的点击按钮

    项目中点击按钮实在太多了,怎么办呢?我们就可以将它们制作成像下拉框那样的类似操作 1.HTML样式部分:关键点在于command 方法和属性 1 <el-dropdown 2 size=&quo ...

  7. vue 根据下拉框动态切换form的rule

    taskCategorySelect (val) { // 任务类别下拉选择 if ( val == 5 ) { this.cameraORgateway = false; // true不可以使用 ...

  8. vue 树形下拉框 亲测 好用

    https://vue-treeselect.js.org/ 顺带说一个开发中使用这个组件遇到的问题,关于回显之后无法修改的问题  找了很长时间 原因是数据类型导致的问题,数组里面应该是数字类型,直接 ...

  9. Vue 日期下拉框

    <!-- html --> <template> <!-- 控件样式 --> <div class="select"> <di ...

随机推荐

  1. iTOP-4412开发板全新升级支持4G全网通模块

    开发板支持4G,GPS,CAN,485,WIFI蓝牙,重力加速度计,陀螺仪等模块. 核心板参数 尺寸:6cm*7cm 高度:连同连接器在内0.26cm CPU:Exynos4412,四核Cortex- ...

  2. 泛型术语:占位类型placeholder

    Here’s a generic version of the same code: struct Stack<Element> { var items = [Element]() mut ...

  3. js如何判断数组是Array类型

    在说明如何判断一个对象为数组类型前,我们先巩固下js的数据类型,js一共有六大数据类型:number.string.object.Boolean.null.undefined.var str=&quo ...

  4. 第二次 Ubuntu16.04 vi编辑器的方向键和退格问题

    新安装ubuntu后,好多人可能都碰到过这样的问题,vi对文件进行编辑时,上下左右键变成了ABDC,退格键也不管用. 解决办法其实也很简单,首先卸载掉旧的vim-common. apt-get rem ...

  5. VM搭建hadoop分布式集群

    1.  安装VMware Workstation Pro 2.安装Ubuntu-16.04 3.以下全程使用sudo –s 切换root权限 4.更新deb软件包列表:apt-get update 5 ...

  6. node assert.equal()

    浅测试,使用等于比较运算符(==)来比较 actual 和 expected 参数. const assert = require('assert'); assert.equal(1, 1); // ...

  7. 初学微信小程序 TodoList

    微信小程序的学习 微信小程序的开始尝试 TodoList 微信开发者工具生成 目录如下: . |-- app.js |-- app.json |-- app.wxss |-- pages | |-- ...

  8. Python中的列表(6)

    列表切片 如何拿到列表中的部分元素,Python 引入了 “切片” 的概念. 上代码: words = ['a','b','c','d'] print(words[0:3]) console: 冒号( ...

  9. LeetCode(6) ZigZag Conversion

    题目 The string "PAYPALISHIRING" is written in a zigzag pattern on a given number of rows li ...

  10. Vue如何实现swiper左右滑动内容区控制导航tab同时切换高亮

    Vue如何实现左右滑动内容区控制导航tab同时切换高亮,实现的效果是:点击导航按钮时内容区发生改变,左右滑动内容区时导航按钮跟随切换高亮,停留在某个内容区时刷新页面后仍然停留在当前内容区.       ...