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 相关文章推荐
使用javascript实现有效时间的控制,并显示将要过期的时间
Jan 02 Javascript
JavaScript动态修改背景颜色的方法
Apr 16 Javascript
smartcrop.js智能图片裁剪库
Oct 14 Javascript
javascript实现数字倒计时特效
Mar 30 Javascript
javascript 封装Date日期类实例详解
May 28 Javascript
详解axios 全攻略之基本介绍与使用(GET 与 POST)
Sep 15 Javascript
详解vue静态资源打包中的坑与解决方案
Feb 05 Javascript
JavaScript设计模式之工厂模式和抽象工厂模式定义与用法分析
Jul 26 Javascript
小程序实现图片预览裁剪插件
Nov 22 Javascript
Vue.js获取手机系统型号、版本、浏览器类型的示例代码
May 10 Javascript
JavaScript 语句之常用 for 循环详解
Mar 29 Javascript
面试中canvas绘制图片模糊图片问题处理
Mar 13 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
WinXP + Apache +PHP5 + MySQL + phpMyAdmin安装全功略
2006/07/09 PHP
PHP.MVC的模板标签系统(四)
2006/09/05 PHP
php str_pad() 将字符串填充成指定长度的字符串
2010/02/23 PHP
php定时删除文件夹下文件(清理缓存文件)
2013/01/23 PHP
laravel 5.4中实现无限级分类的方法示例
2017/07/27 PHP
关于ExtJS4.1:快捷键支持的问题
2013/04/24 Javascript
jquery实现简单的拖拽效果实例兼容所有主流浏览器
2013/06/21 Javascript
JavaScript数组深拷贝和浅拷贝的两种方法
2014/04/16 Javascript
解决Jquery向页面append新元素之后事件的绑定问题
2015/03/16 Javascript
基于ajax实现文件上传并显示进度条
2015/08/03 Javascript
jquery实现左右无缝轮播图
2020/07/31 Javascript
利用JavaScript阻止表单提交的两种方法
2016/08/11 Javascript
微信小程序 PHP后端form表单提交实例详解
2017/01/12 Javascript
详解JavaScript 中getElementsByName在IE中的注意事项
2017/02/21 Javascript
Linux使用Node.js建立访问静态网页的服务实例详解
2017/03/21 Javascript
Linux CentOS系统下安装node.js与express的方法
2017/04/01 Javascript
JS请求servlet功能示例
2017/06/01 Javascript
详解node.js 下载图片的 2 种方式
2018/03/02 Javascript
对node.js中render和send的用法详解
2018/05/14 Javascript
用Python将动态GIF图片倒放播放的方法
2016/11/02 Python
浅谈numpy中linspace的用法 (等差数列创建函数)
2017/06/07 Python
基于Python的图像数据增强Data Augmentation解析
2019/08/13 Python
初次部署django+gunicorn+nginx的方法步骤
2019/09/11 Python
你还在@微信官方?聊聊Python生成你想要的微信头像
2019/09/25 Python
python之生成多层json结构的实现
2020/02/27 Python
Python如何合并多个字典或映射
2020/07/24 Python
意大利简约的休闲品牌:Aspesi
2018/02/08 全球购物
2014元旦晚会策划方案
2014/02/19 职场文书
地球一小时宣传标语
2014/06/24 职场文书
人大调研汇报材料
2014/08/14 职场文书
教师学习群众路线心得体会
2014/11/04 职场文书
2014年煤矿工人工作总结
2014/12/08 职场文书
2015年教师节主持词
2015/07/03 职场文书
文艺有韵味的诗句(生命类、亲情类...)
2019/07/11 职场文书
各类场合主持词开场白范文集锦
2019/08/16 职场文书
小程序自定义轮播图圆点组件
2022/06/25 Javascript