官方演示地址

     // v5及之后的版本 数据依赖于area_data
        npm i --save vue-area-linkage area-data
        import Vue from 'vue';
        import { pca, pcaa } from 'area-data'; // v5 or higher
        import 'vue-area-linkage/dist/index.css'; // v2 or higher
        import VueAreaLinkage from 'vue-area-linkage';

        Vue.use(VueAreaLinkage)
        // 使用
        // v5及之后的版本
        <area-select v-model="selected" :data="pca"></area-select> // 省市
        <area-select v-model="selected" :data="pcaa"></area-select> // 省市区:
        <area-cascader v-model="selected2" :data="pca"></area-cascader> // 省市
        <area-cascader v-model="selected2" :data="pcaa"></area-cascader> // 省市区:

        //setting
        <area-select type='all' :level='2' v-model="selected" :data="pcaa"></area-select>
        <area-cascader type='all' v-model="selected2" :level='1' :data="pcaa"></area-cascader>

文档地址

vue-area-linkage Vue省市区三级列表联动插件使用的更多相关文章

  1. 黄聪:基于jQuery+JSON的省市区三级地区联动

    查看演示:http://www.helloweba.com/demo/cityselect/ 源码下载:http://files.cnblogs.com/files/huangcong/citysel ...

  2. layui自定义插件citySelect 省市区三级联动选择

    省市区三级菜单联动插件 citySelect.js /** * @ name : citySelect 省市区三级选择模块 * @ Author: aggerChen * @ version: 1.0 ...

  3. vue仿京东省市区三级联动选择组件

    工作中需要一个盒京东购物车地址选择相似的一个省市区三级联动选择组件,google查了下都是下拉框形式的,于是自己写了一个,希望对使用vue开发项目的朋友有帮助,显示效果如下:使用vue2.0开发 ht ...

  4. vue 引用省市区三级联动(element-ui Cascader)

    npm 下载 npm install element-china-area-data -S main.js import {provinceAndCityData,regionData,provinc ...

  5. vue 引用省市区三级联动(插件)

    vue 用省市区三级联动之傻瓜式教程(复制粘贴即用) npm 下载 npm install v-distpicker --save main.js //引入 省市区三级联动 import Distpi ...

  6. vue省市区三级联动

    仿照小米之家做的一个省市区三级联动,先上代码: HTML: <template> <section class="myAddress"> <secti ...

  7. 省市区三级联动(vue)

    vue项目中使用到三级联动,现在自己实现一个三级联动,仅供大家参考一下,直接上代码. <template> <section class="container"& ...

  8. vue+element实现省区市三级联动以及详细地址的输入

    Vue+elementui实现省区市三级联动+详细地址的输入 详细需求,需要手动更改用户所在的地址. 安装依赖项 npm install element-china-area-data -S 在组建中 ...

  9. JS实现年月日三级联动+省市区三级联动+国家省市三级联动

    开篇随笔:最近项目需要用到关于年月日三级联动以及省市区三级联动下拉选择的功能,于是乎网上搜了一些做法,觉得有一些只是给出了小的案例或者只有单纯的js还不完整,却很难找到详细的具体数据(baidu搜索都 ...

随机推荐

  1. DPA从DPA 10.0.352升级到DPA 11.0.373

    1: 解压安装文件SolarWinds-DPA-11.0.373-64bit.tar.gz [root@lnxmonitor tmp]# tar -xzvf SolarWinds-DPA-11.0.3 ...

  2. sql-server的添加数据库文件(日志数据)以及收缩数据库文件(日志数据)

    环境: SSMS sql-server2016 一.为数据库添加数据文件 添加日志数据文件 以下是添加数据文件和日志文件的代码 ALTER DATABASE [joinbest] ADD FILE ( ...

  3. Oracle EBS 查看执行计划

    explain plan forSELECT MMT.TRANSACTION_ID,GIR.JE_HEADER_ID,GIR.JE_LINE_NUMFROM   GL_IMPORT_REFERENCE ...

  4. Linux系统修改日期时间

    linux修改时间   服务器时间与网络时间不符: 一.手动修改 1. date命令:查看当前时间 2. date -s  时分秒 :修改时间 还需要把日期改过来 3. date -s  完整日期时间 ...

  5. PostgreSQL分页

    转自 https://blog.csdn.net/tomcat_2014/article/details/49947711 如果用过mysql,那么对 select * from xxx limit ...

  6. OpenSSL 正确安装

    经过几天的各种尝试,总算正常安装了openssl,中途差点各种放弃,最后总算装好了. 环境:Win10 , 为了装OpenSSL 而安装了vs2010,没有验证必须要装的 安装步骤: .从openss ...

  7. emacs 利用 auto-complete 自动补齐

    emacs 利用 auto-complete 自动补齐 1,首先导入melpa,在文件~/.emacs中添加下面代码 (require 'package) (package-initialize) ( ...

  8. Django中间件的使用

    Django中间件的使用 中间件(middleware) 中间件应用于request与服务端之间和服务端与response之间,客户端发起请求到服务端接收可以通过中间件,服务端返回响应与客户端接收响应 ...

  9. 将正在运行的Proxmox EV5.x版本更新到最新版本

    问题描述: 最近搭建了一个KVM开源虚拟化平台 Proxmox Virtual Environment是一种基于QEMU / KVM和LXC的开源服务器虚拟化管理解决方案.您可以使用集成的,易于使用的 ...

  10. Cobalt Strike 服务器搭建及使用

    Cobalt Strike使用中的一些坑(一) http://www.cnblogs.com/miaodaren/articles/7829793.html cobaltstrike3.8服务器搭建及 ...