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实现非常简单的焦点图切换特效实例
May 07 Javascript
原生js的数组除重复简单实例
May 24 Javascript
自定义vue全局组件use使用、vuex的使用详解
Jun 14 Javascript
将Sublime Text 3 添加到右键中的简单方法
Dec 12 Javascript
vue初尝试--项目结构(推荐)
Jan 30 Javascript
详解js类型判断
May 22 Javascript
vue2.0 自定义组件的方法(vue组件的封装)
Jun 05 Javascript
通过jquery的ajax请求本地的json文件方法
Aug 08 jQuery
JS函数内部属性之arguments和this实例解析
Oct 07 Javascript
详解ES6 系列之异步处理实战
Oct 26 Javascript
微信小程序学习笔记之表单提交与PHP后台数据交互处理图文详解
Mar 28 Javascript
Layui表格监听行单双击事件讲解
Nov 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
ajax+php打造进度条代码[readyState各状态说明]
2010/04/12 PHP
深入解析PHP的引用计数机制
2013/06/14 PHP
php过滤html标记属性类用法实例
2014/09/23 PHP
php保存二进制原始数据为图片的程序代码
2014/10/14 PHP
yii2实现根据时间搜索的方法
2016/05/25 PHP
解析 thinkphp 框架中的部分方法
2017/05/07 PHP
js实现上传图片之上传前预览图片
2013/03/25 Javascript
Javascript delete 引用类型对象
2013/11/01 Javascript
javascript匿名函数应用示例介绍
2014/03/07 Javascript
javascript入门之数组[新手必看]
2016/11/21 Javascript
JS实现控制图片显示大小的方法【图片等比例缩放功能】
2017/02/18 Javascript
js省市区级联查询(插件版&amp;无插件版)
2017/03/21 Javascript
node.js 利用流实现读写同步,边读边写的方法
2017/09/11 Javascript
浅谈Node Inspector 代理实现
2017/10/19 Javascript
Vue.js组件通信的几种姿势
2017/10/23 Javascript
详解mpvue中小程序自定义导航组件开发指南
2019/02/11 Javascript
[00:43]DOTA2小紫本全民票选福利PA至宝全方位展示
2014/11/25 DOTA
Python2/3中urllib库的一些常见用法
2017/12/19 Python
Python实现的生成格雷码功能示例
2018/01/24 Python
Python iter()函数用法实例分析
2018/03/17 Python
pandas 透视表中文字段排序方法
2018/11/16 Python
Python3.4学习笔记之 idle 清屏扩展插件用法分析
2019/03/01 Python
python可视化实现KNN算法
2019/10/16 Python
python判断无向图环是否存在的示例
2019/11/22 Python
Python numpy.zero() 初始化矩阵实例
2019/11/27 Python
python Shapely使用指南详解
2020/02/18 Python
Selenium 滚动页面至元素可见的方法
2020/03/18 Python
python 安装impala包步骤
2020/03/28 Python
python爬虫爬取图片的简单代码
2021/01/18 Python
斐乐美国官方网站:FILA美国
2019/03/01 全球购物
类、抽象类、接口的差异
2016/06/13 面试题
Linux上比较文件的命令都有哪些
2013/09/28 面试题
中考冲刺决心书
2014/03/11 职场文书
田径运动会通讯稿
2014/09/13 职场文书
宝塔更新Python及Flask项目的部署
2022/04/11 Python
Java 异步任务计算FutureTask
2022/04/28 Java/Android