post.vue

import timePicker from '@/components/timePicker'
import { mapState } from 'vuex'
import * as _ from '../util/tool'
import api from '../fetch/api'
require('../util/city-picker.js')

import $city from '../util/city.js'

mounted() {

 new MultiPicker({
     input: 'multiPickerInput',//點選觸發外掛的input框的id
container
 
: 'address-select',//外掛插入的容器id
jsonData: $city,
success: (arr) => {
         console.log(arr)
               switch(arr.length) {
                   case 2:
                       this.destination1 = arr[0].value + ' ' + arr[1].value
break
                   case 3:
                       this.destination1 
 
= arr[0].value + ' ' + arr[1].value + ' ' + arr[2].value
break
}
     }//回撥
});
},

city.js 

var $city = [
    {
        "value": "北京",
"child": [
            {
                "value": "請選擇"
},
{
                "value": "東城區"
},
{
                "value": "西城區"
},
{
                "value": "崇文區"
},
{
                "value"
 
: "宣武區"
},
{
                "value": "朝陽區"
},
{
                "value": "海淀區"
},
{
                "value": "豐臺區"
},
{
                "value": "石景山區"
},
{
                "value": "房山區"
},
{
                "value": "通州區"
},
{
                "value": "順義區"
},
{
                "value": "昌平區"
},
{
                "value": "大興區"
},
{
                "value": "懷柔區"
},
{
                "value": "平谷區"
},
{
                "value": "門頭溝區"
},
{
                "value": "密雲縣"
},
{
                "value": "延慶縣"
},
{
                "value": "其他"
}
        ],
"id": 0
},

export default $city

city-picker.js

(function (wid, dcm) {
    var win = wid;
var doc = dcm;

function MultiPicker(config) {
    this.input     = config.input;
this.container = config.container;
this.jsonData  = config.jsonData;
this.success   = config.success;
this.ulCount   = 0; //記錄上一次的
this.ulIdx     = 0; //ul下標計數器,前一次的計數器
this.ulDomArr  = [];//ul的dom元素,【a】
this.idxArr    = [];//更新後的ul的下標 【a】
this.jsonArr   = [];//用來儲存每個ul的li中顯示的arr【a】
this.liHeight  = 40;
this.maxHeight = [];//每個ul的最大高度【a】
this.distance  = [];//transition的移動位置【a】
this.start     = {
        Y: 0,
time: ''
};
this.move      = {
        Y: 0,
speed: []
    };
this.end       = {
        Y: 0,
status: true,
};
this.resultArr = [];
this.initDomFuc();
this.initReady(0, this.jsonData[0]);
this.initBinding();
}

MultiPicker.prototype = {
    constructor: MultiPicker,
generateArrData: function (targetArr) {
        var tempArr = [];
loop(0, targetArr.length, function (i) {
            tempArr.push({
                "id": targetArr[i].id,
"value": targetArr[i].value
})
        });
return tempArr;
},

    };
if (typeof exports == "object") {
        module.exports = MultiPicker;
} else if (typeof define == "function" && define.amd) {
        define([], function () {
            return MultiPicker
})
    } else {
        win.MultiPicker = MultiPicker;
} 
})(window, document);