vue-area-linkage Vue省市区三级列表联动插件使用
// 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省市区三级列表联动插件使用的更多相关文章
- 黄聪:基于jQuery+JSON的省市区三级地区联动
查看演示:http://www.helloweba.com/demo/cityselect/ 源码下载:http://files.cnblogs.com/files/huangcong/citysel ...
- layui自定义插件citySelect 省市区三级联动选择
省市区三级菜单联动插件 citySelect.js /** * @ name : citySelect 省市区三级选择模块 * @ Author: aggerChen * @ version: 1.0 ...
- vue仿京东省市区三级联动选择组件
工作中需要一个盒京东购物车地址选择相似的一个省市区三级联动选择组件,google查了下都是下拉框形式的,于是自己写了一个,希望对使用vue开发项目的朋友有帮助,显示效果如下:使用vue2.0开发 ht ...
- vue 引用省市区三级联动(element-ui Cascader)
npm 下载 npm install element-china-area-data -S main.js import {provinceAndCityData,regionData,provinc ...
- vue 引用省市区三级联动(插件)
vue 用省市区三级联动之傻瓜式教程(复制粘贴即用) npm 下载 npm install v-distpicker --save main.js //引入 省市区三级联动 import Distpi ...
- vue省市区三级联动
仿照小米之家做的一个省市区三级联动,先上代码: HTML: <template> <section class="myAddress"> <secti ...
- 省市区三级联动(vue)
vue项目中使用到三级联动,现在自己实现一个三级联动,仅供大家参考一下,直接上代码. <template> <section class="container"& ...
- vue+element实现省区市三级联动以及详细地址的输入
Vue+elementui实现省区市三级联动+详细地址的输入 详细需求,需要手动更改用户所在的地址. 安装依赖项 npm install element-china-area-data -S 在组建中 ...
- JS实现年月日三级联动+省市区三级联动+国家省市三级联动
开篇随笔:最近项目需要用到关于年月日三级联动以及省市区三级联动下拉选择的功能,于是乎网上搜了一些做法,觉得有一些只是给出了小的案例或者只有单纯的js还不完整,却很难找到详细的具体数据(baidu搜索都 ...
随机推荐
- tkinter——GUI设计实操
1.创建root: from tkinter import * root = Tk() root.title('GUI设计') # root.attributes("-alpha" ...
- MyBatis笔记----Mybatis3.4.2与spring4整合:增删查改
结构图 刚之前没什么区别,多了一个applicationContext.xml 包图 由于之前出了一点错误,有些包可能多加上了 数据库图 model User.java package com.ij3 ...
- C#-多态(十二)
继承概念 多态:即一个接口,多个功能 同一种操作作用于不同的对象,可以有不同的解释,产生不同的执行结果 多态性可以是静态的或动态的.在静态多态性中,函数的响应是在编译时发生的.在动态多态性中,函数的响 ...
- JMeter—常见问题(十四)
参考<全栈性能测试修炼宝典JMeter实战>第十五章 JMeter常见问题 1.无法产生负载 注意检查各元件是否时禁用状态.JMeter在运行时是以数形式加载各种元件的,如果父节点被禁用, ...
- Linux进程启动过程分析do_execve(可执行程序的加载和运行)---Linux进程的管理与调度(十一)
execve系统调用 execve系统调用 我们前面提到了, fork, vfork等复制出来的进程是父进程的一个副本, 那么如何我们想加载新的程序, 可以通过execve来加载和启动新的程序. x8 ...
- Windows 下自动同步文件夹内容到另一个文件夹下
实现windows 使用bat脚本文件,复制文件夹到另一个盘,参考如下代码:/y是可以不显示:提示你需要覆盖一个文件,如下图: bat文件内容为 @echo off echo "使用bat脚 ...
- #007 C语言大作业学生管理系统第四天
第四天还差恢复已删除学生功能 对于我来说,已经开始很复杂了. 小细节太重要了,边写边出错 1 #include<stdio.h> #include<stdlib.h> #inc ...
- Python中可变和不可变类型
可变类型 列表,字典,集合 不可变类型 数字,字符串,元组 这里的可变不可变,是指内存中的那块内容(value)是否可以被改变 不可变类型 数字 a = 1 b = 1 print(id(a), id ...
- 【Teradata】数值类型
1.Decimal(n,m) 十进位小数 n为最大数值位数(取值1-38),m为小数位数(取值0-n). decimal(3,2) -9.99 to 9.99 decimal(4,4) - ...
- Hadoop下添加节点和删除节点
添加节点 1.修改host 和普通的datanode一样.添加namenode的ip 2.修改namenode的配置文件conf/slaves 添加新增节点的ip或host 3.在新节点的机器 ...