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 相关文章推荐
分享一个asp.net pager分页控件
Jan 04 Javascript
jQuery中RadioButtonList的功能及用法实例介绍
Aug 23 Javascript
屏蔽script注入小例子
Nov 12 Javascript
JavaScript Math.ceil() 函数使用介绍
Dec 11 Javascript
jQuery鼠标事件总结
Oct 13 Javascript
基于Three.js插件制作360度全景图
Nov 29 Javascript
浅谈Node模块系统及其模式
Nov 17 Javascript
小程序实现列表点赞功能
Nov 02 Javascript
简单了解Javscript中兄弟ifream的方法调用
Jun 17 Javascript
uni-app从安装到卸载的入门教程
May 15 Javascript
vue实现购物车案例
May 30 Javascript
解决vue路由name同名,路由重复的问题
Aug 05 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 chmod 函数与批量修改文件目录权限
2010/05/10 PHP
基于PHP 面向对象之成员方法详解
2013/05/04 PHP
PHP封装的HttpClient类用法实例
2015/06/17 PHP
PHP实现webshell扫描文件木马的方法
2017/07/31 PHP
使用composer安装使用thinkphp6.0框架问题【视频教程】
2019/10/01 PHP
使一个函数作为另外一个函数的参数来运行的javascript代码
2007/08/13 Javascript
javascript之更有效率的字符串替换
2008/08/02 Javascript
判断JavaScript对象是否可用的最正确方法分析
2008/10/03 Javascript
extjs DataReader、JsonReader、XmlReader的构造方法
2009/11/07 Javascript
JavaScript的单例模式 (singleton in Javascript)
2010/06/11 Javascript
JavaScript中各种编码解码函数的区别和注意事项
2010/08/19 Javascript
Javascript无阻塞加载具体方式
2013/06/28 Javascript
js实现显示当前状态的导航效果代码
2015/08/28 Javascript
JS实现获取当前URL和来源URL的方法
2016/08/24 Javascript
bootstrap 下拉多选框进行多选传值问题代码分析
2017/02/14 Javascript
jQuery插件zTree实现单独选中根节点中第一个节点示例
2017/03/08 Javascript
详解设置Webstorm 利用babel将ES6自动转码成ES5
2017/12/20 Javascript
工作中常用到的ES6语法
2018/09/04 Javascript
NodeJS加密解密及node-rsa加密解密用法详解
2018/10/12 NodeJs
原生JS使用Canvas实现拖拽式绘图功能
2019/06/05 Javascript
Angular8 Http拦截器简单使用教程
2019/08/20 Javascript
Vue3 的响应式和以前有什么区别,Proxy 无敌?
2020/05/20 Javascript
[00:48]DOTA2国际邀请赛公开赛报名开始 扫码开启逐梦之旅
2018/06/06 DOTA
python显示天气预报
2014/03/02 Python
python静态方法实例
2015/01/14 Python
在Django的模型和公用函数中使用惰性翻译对象
2015/07/27 Python
python爬虫爬取淘宝商品信息
2018/02/23 Python
Window10下python3.7 安装与卸载教程图解
2019/09/30 Python
乌克兰数字设备、配件和智能技术的连锁商店:KTC
2020/08/18 全球购物
上海中网科技笔试题
2012/02/19 面试题
委托协议书范本
2014/04/22 职场文书
活动总结的格式
2014/05/07 职场文书
爱与责任师德演讲稿
2014/08/26 职场文书
领导干部贪图享乐整改措施
2014/09/21 职场文书
毕业生个人总结
2015/02/28 职场文书
浅谈Python中的函数(def)及参数传递操作
2021/05/25 Python