vue 省市区三级联动插件v-distpicker

learning 发布于2019-08-23 18:02 / 1431人阅读

摘要：十分便捷的三级联动插件官网步骤下载步骤使用与引入在中注册全局组件在文件中使用组件你需要用到三级联动的页面的里如何使用组件在该文件的部分写广东省广州市海珠区移动端步骤如何获取他们的数据给部分一个点击事件在配置

十分便捷的三级联动插件

官网：https://www.awesomes.cn/repo/...

步骤1：下载

  npm install v-distpicker --save

  yarn add v-distpicker --save

步骤2：使用与引入
① 在main.js中注册全局组件

import Distpicker from "v-distpicker"

Vue.component("v-distpicker", Distpicker)

② 在.vue文件中使用组件（你需要用到三级联动的.vue页面的js里）

import VDistpicker from "v-distpicker"
 
export default {
  components: { VDistpicker }
}

③ 如何使用组件（在该.vue文件的html部分写）

移动端Mobile

步骤3：如何获取他们的数据
① 给html部分一个点击事件

② 在vue配置方法里边用点击事件获取data:

selected(data){
 
    this.province = data.province.value

    this.city = data.city.value

}

GPU云服务器云服务器省市三级联动陕西 js省市县三级联动省市联动省市多级联动

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/104550.html

vue项目中使用element-ui下拉框选项值为对象时报错

摘要：在做后台管理时，使用了搭配，请求方法使用了插件，在使用下拉框时，因为我需要获取选中的选项中的其他值，因此需要传入对象。在做后台管理时，使用了vue搭配elementUI，请求方法使用了axios插件，在使用下拉框时，因为我需要获取选中的选项中的其他值，因此需要传入对象。对select下拉框的文档没有读的很仔细，百度过几篇文章，也没有理解他们表达的意思，然后自己又去看文档，把他的属性看...

Drummor 2019-08-26 10:57 评论0 收藏0
使用vue+element ui 实现省市区三级联动

摘要：使用实现省市区三级联动开发工具使用技术效果图如下话不多说上代码一，页面部分二，部分首先引入以下代码注意引入上方代码之前需先运行下方代码进行安装然后再写入以下代码这样一个省市区三级联动的下拉列表就完成了 ...

netScorpion 2021-11-11 16:54 评论0 收藏0
原生js实现省市区三级联动插件

原生js实现省市区三级联动插件前言插件功能只满足我司业务需求，如果希望有更多功能的，可在下方留言，我尽量扩展！如果你有需要或者喜欢的话，可以给我github来个star ? 仓库地址在线预览准备 // 页面上先引入css与js文件页面中的容器标签不限制，只需给个id就行 var address = new Address({ wrapId: wrap, showArr...

mumumu 2019-08-26 11:43 评论0 收藏0
jquery移动端省市县（区）三级联动插件

摘要：写省市区三级联动插件的关键是在于你如何编写自己的省市县区文件，你要是把数据格式写对了，可以很轻松的写一省市区插件出来。最近刚做完一个版本的项目，闲暇时间，就索性把项目中需要用到的插件都自己写了一个，毕竟自己动手丰衣足食才是最重要，自己写的，可以应对各种项目需求，今天又把手机端的省市区三级联动选择功能编写了一个插件出来，代码很简单，样式也是应用的跟日期时间选择插件的一样。写省市区三级联...

Rocko 2019-08-01 17:35 评论0 收藏0
jquery移动端省市县（区）三级联动插件

摘要：写省市区三级联动插件的关键是在于你如何编写自己的省市县区文件，你要是把数据格式写对了，可以很轻松的写一省市区插件出来。最近刚做完一个版本的项目，闲暇时间，就索性把项目中需要用到的插件都自己写了一个，毕竟自己动手丰衣足食才是最重要，自己写的，可以应对各种项目需求，今天又把手机端的省市区三级联动选择功能编写了一个插件出来，代码很简单，样式也是应用的跟日期时间选择插件的一样。写省市区三级联...

spacewander 2019-08-21 16:22 评论0 收藏0