県市3段階連携プラグイン(v-distpicker)

インストール:

npm install v-distpicker --save //npm安装

グローバル登録:

//全局注册
import Distpicker from 'v-distpicker'
Vue.component('v-distpicker', Distpicker)

部分登録:

//局部注册
import VDistpicker  from 'v-distpicker'
export default { components: { VDistpicker }}

ベース:

//基础
<v-distpicker></v-distpicker>

デフォルトで選択されているもの:

//默认选中 浙江省杭州市西湖区
<v-distpicker province="浙江省" city="杭州市" area="西湖区"></v-distpicker>

携帯端末:

//移动端
<v-distpicker type="mobile"></v-distpicker>

選択したデータを取得します。

//获取选中的数据
<v-distpicker @selected="selected"></v-distpicker>
export default {
    methods:{
		selected(data){
          this.province = data.province.value;
          this.city = data.city.value;
          this.area = data.area.value;
          console.log(this.province,this.city,this.area);
        },
    },
},

おすすめ

転載: blog.csdn.net/weixin_55992854/article/details/120055377