官网地址:https://distpicker.uine.org/

安装:

npm install v-distpicker --save

局部注册:

import VDistpicker from 'v-distpicker'

export default {
components: { VDistpicker }
}

使用:

<template>
<v-distpicker></v-distpicker>
<template> <script>
import VDistpicker from 'v-distpicker' export default {
components: { VDistpicker },
}
</script>

为啥变得这么简单,因为底层做了一个组件封装,如下所示:

之后,改吧改吧,可以了

基于Vue的省市区三级联动插件的更多相关文章

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

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

  2. jQuery省市区三级联动插件

    体验效果:http://hovertree.com/texiao/bootstrap/4/支持PC和手机移动端. 手机扫描二维码体验效果: 代码如下: <!DOCTYPE html> &l ...

  3. 项目一:第九天 1、前台客户登录 2、Jquery citypicker省市区三级联动插件 4、业务受理(在线下单)

    1. 前台客户登录 2. Jquery citypicker省市区三级联动插件 3. 百度地图介绍 4. 业务受理(在线下单) 1 实现前台系统登录功能 1.1 Md5加密 admin(明文)---- ...

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

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

  5. jquery全国省市区三级联动插件distpicker

    使用步骤: 1.引入js <script src="distpicker/jquery.min.js" type="text/javascript" ch ...

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

    npm 下载 axios npm install --save axios static 静态文件夹里 创建 json 文件夹 json 文件夹里创建 map.json map.json 文件里写 ( ...

  7. vue实现省市区三级联动

    npm 安装 npm install v-distpicker --save Vue全局引入组件 import Distpicker from 'v-distpicker' Vue.component ...

  8. 省市区三级联动插件:app-jquery-cityselect.js

    (function ($) { $.fn.cityselect = function (options) { var settings = $.extend ({}, options); this.e ...

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

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

随机推荐

  1. 版本名称SNAPSHOT、alpha、beta、release、GA含义

    Alpha:是内部测试版,一般不向外部发布,会有很多Bug.一般只有测试人员使用.Beta:也是测试版,这个阶段的版本会一直加入新的功能.在Alpha版之后推出.RC:(Release Candida ...

  2. hdu 1042 N!(大数)

    题意:求n!(0 ≤ N ≤ 10000) 思路:大数,用数组存储 1.首先要考虑数据N!的位数,因为最大是10000!,可以计算一下大概是5+9000*4+900*3+90*2+10*1=38865 ...

  3. H5内容安全尺寸

    设备独立像素:iPhone5:320 * 568 >> 微信网页可视区高度:504px   iPhone6:375 * 667 >> 微信网页可视区高度:603px 设备独立像 ...

  4. AtCoder Beginner Contest 100 2018/06/16

    A - Happy Birthday! Time limit : 2sec / Memory limit : 1000MB Score: 100 points Problem Statement E8 ...

  5. bzoj 3771: Triple 快速傅里叶变换 FFT

    题目大意: 给出\(n\)个互不相同的物品,每个物品有价值\(x_i(x_i \leq 40000)\)如果可以从中取一个或两个或三个物品.问能够组合出来的所有价值和对应的方案数,全部输出.取值时,\ ...

  6. bzoj 4032 [ HEOI 2015 ] 最短不公共子串 —— 后缀自动机+序列自动机

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=4032 序列自动机其实就是每个位置记录一下某字母后面第一个出现位置,为了子序列能尽量长. 对字 ...

  7. MMU的理解

    MMU内存管理单元相关知识点总结 1.MMU是Memory Management Unit的缩写,中文名是内存管理单元,它是中央处理器(CPU)中用来管理虚拟存储器.物理存储器的控制线路,同时也负责虚 ...

  8. ExecutorService和CompletionService区别

    ExecutorService和CompletionService区别: ExecutorService:一直习惯自己维护一个list保存submit的callable task所返回的Future对 ...

  9. 浅析C语言中strtol()函数与strtoul()函数的用法

    转自:http://www.jb51.net/article/71463.htm C语言strtol()函数:将字符串转换成long(长整型数) 头文件: ? 1 #include <stdli ...

  10. 开源.Net项目合集

    http://www.cnblogs.com/StrangeCity/p/OpenSourceProject.html