城市选择插件 V-Distpicker 组件详解以及全套用法

首先第一步,这个插件是一定要在vue项目中使用的
一,安装
使用 npm 安装:

npm install v-distpicker --save

使用 yarn 安装

yarn add v-distpicker --save

二使用
1.在main.js中引入

import VDistpicker from 'v-distpicker'

Vue.component('v-distpicker', VDistpicker);

2.在你想要用这个插件的页面引入

	import VDistpicker from 'v-distpicker'

export default {

 components: { VDistpicker }

}

三.简单使用
基础


默认值


移动端


四.直接使用到项目中(直接复制我下面的就可以啦)
1.获取选择的值


2.在你引用 v-distpicker 的父组件里面定义几个方法来获取选择的值。


3.样式(官网给出的样式使用scss写的 如果你要用还得配scss,比较麻烦)


用我这个写出来的取值有点问题,就是第一遍选完之后接着选第二遍的时候第一遍的没有清空,欢迎大神有更好的修改方案
最后附上我参考的原链接:
希望可以帮到大家!!!

你可能感兴趣的:(vue,V-Distpicker,城市选择插件)