vue树形结构获取键值的方法示例


Posted in Javascript onJune 21, 2018

本文介绍了vue树形结构获取键值的方法示例,分享给大家,具体如下:

把键值文件放入

vue树形结构获取键值的方法示例

引入控件

import { getTypeValue } from '@/api/dict/dictValue/index';

vue树形结构获取键值的方法示例

点击搜索,打开弹窗

<el-form-item label="机构名称" placeholder="请选择机构" prop="orgName">

 <el-input readonly type="text" v-model="form.orgName">

  <el-button slot="append" icon="el-icon-search" @click="openDepartDialog()"></el-button>

 </el-input>

</el-form-item>

vue树形结构获取键值的方法示例

打开控件事件,关闭控件事件

openDepartDialog() {

 this.dialogDepartVisible = true

},

closeDepartDialog(depart) {

 console.log(depart)

 this.form.orgName = depart.label

 this.form.code = depart.id

 this.form.departId = depart.id

 this.dialogDepartVisible = false

},

vue树形结构获取键值的方法示例

关闭弹窗按钮

<el-dialog title="选择机构" width="30%" :visible.sync="dialogDepartVisible">

 <depart-selector @closeDepartDialog="closeDepartDialog" ref="departSelector"></depart-selector>

 <span slot="footer" class="dialog-footer">

  <el-button class="filter-item" style="margin-left: 10px;" @click="handlerAddDepart" type="primary" icon="edit">添加</el-button>

 </span>

</el-dialog>

vue树形结构获取键值的方法示例

vue树形结构获取键值的方法示例

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js过滤数组重复元素的方法
Sep 05 Javascript
jquery 定位input元素的几种方法小结
Jul 28 Javascript
jQuery回车实现登录简单实现
Aug 20 Javascript
JavaScript中document.forms[0]与getElementByName区别
Jan 21 Javascript
JS获取Table中td值的方法
Mar 19 Javascript
JQuery导航菜单选择特效
Apr 11 Javascript
微信小程序 前端源码逻辑和工作流详解
Oct 08 Javascript
jquery购物车结算功能实现方法
Oct 29 Javascript
vue移动端监听滚动条高度的实现方法
Sep 03 Javascript
微信小程序使用wxParse解析html的方法示例
Jan 17 Javascript
vue限制输入框只能输入8位整数和2位小数的代码
Nov 06 Javascript
vue设置全局访问接口API地址操作
Aug 14 Javascript
vue使用jsonp抓取qq音乐数据的方法
Jun 21 #Javascript
Vue 获取数组键名的方法
Jun 21 #Javascript
Taro集成Redux快速上手的方法示例
Jun 21 #Javascript
vue2.0项目实现路由跳转的方法详解
Jun 21 #Javascript
JS实现快递单打印功能【推荐】
Jun 21 #Javascript
详解javascript中的babel到底是什么
Jun 21 #Javascript
webpack打包react项目的实现方法
Jun 21 #Javascript
You might like
在PHP中使用模板的方法
2008/05/24 PHP
swfupload 多文件上传实现代码
2008/08/27 PHP
php 字符过滤类,用于过滤各类用户输入的数据
2009/05/27 PHP
Codeigniter控制器controller继承问题实例分析
2016/01/19 PHP
phpQuery采集网页实现代码实例
2020/04/02 PHP
Javascript实现CheckBox的全选与取消全选的代码
2010/07/20 Javascript
原生javascript图片自动或手动切换示例附演示源码
2013/09/04 Javascript
基于JS实现新闻列表无缝向上滚动实例代码
2016/01/22 Javascript
Angularjs实现多个页面共享数据的方式
2016/03/29 Javascript
遍历json 对象的属性并且动态添加属性的实现
2016/12/02 Javascript
JavaScript实现三级联动菜单效果
2017/08/16 Javascript
vue.js 实现评价五角星组件的实例代码
2018/08/13 Javascript
使用vue中的混入mixin优化表单验证插件问题
2019/07/02 Javascript
中级前端工程师必须要掌握的27个JavaScript 技巧(干货总结)
2019/09/23 Javascript
使用preload预加载页面资源时注意事项
2020/02/03 Javascript
微信小程序swiper组件实现抖音翻页切换视频功能的实例代码
2020/06/24 Javascript
[54:18]DOTA2-DPC中国联赛 正赛 PSG.LGD vs LBZS BO3 第一场 1月22日
2021/03/11 DOTA
Python3通过Luhn算法快速验证信用卡卡号的方法
2015/05/14 Python
浅谈Tensorflow由于版本问题出现的几种错误及解决方法
2018/06/13 Python
使用Python快速制作可视化报表的方法
2019/02/03 Python
django框架使用方法详解
2019/07/18 Python
python openvc 裁剪、剪切图片 提取图片的行和列
2019/09/19 Python
TensorFlow查看输入节点和输出节点名称方式
2020/01/04 Python
Python退出时强制运行一段代码的实现方法
2020/04/29 Python
Python中使用threading.Event协调线程的运行详解
2020/05/02 Python
tensorflow pb to tflite 精度下降详解
2020/05/25 Python
Python安装并操作redis实现流程详解
2020/10/13 Python
python中scrapy处理项目数据的实例分析
2020/11/22 Python
美国折扣网站:jClub
2017/08/07 全球购物
英国家居装饰品、户外家具和玻璃器皿购物网站:Rinkit.com
2019/11/04 全球购物
Auguste The Label官网:澳大利亚一家精品女装时尚品牌
2020/06/14 全球购物
命名空间(namespace)和程序集(Assembly)有什么区别
2015/09/25 面试题
软件部经理岗位职责范本
2014/02/25 职场文书
班委竞选演讲稿
2014/04/28 职场文书
留守儿童工作方案
2014/06/02 职场文书
2016年企业先进员工事迹材料
2016/02/25 职场文书