vw布局下的picker组件(依赖vue-awesome-swiper)

1. 使用swiper组件实现滚动（npm install vue-awesome-swiper --save）
2. 监听options，如传入options，则显示picker(options为String数组或对象数组，对象格式{text: '文字', value: '值'})
3. origin表示多个选项框在同一页面时的来源
4. 监听父组件自定义的confirm事件，返回pick值 注： confirm和cancel事件，方法最后一步要this.opitons=[];否则，ajax赋值的指针类型的数据，无法触发picker显示(options输入固定的情况，可以不加)

使用方法：（父组件中)
<template>
  <div>
    <div @click="selectCity" class="clearHighlight">选择城市</div> // selectCity中传入对应options
    <div @click="selectId" class="clearHighlight">选择身份</div>  // selectId中传入对应options

    <picker :options="options" :origin="origin" @confirm="confirm" @cancel="cancel"></picker>   // picker中绑定自定义事件confirm, 传入options, picker最好放在html元素层级最外层
  </div>
</template>
import picker from 'picker'

export default {
  data () {
    return {
      origin: '',
      options: []
    }
  },
  components: {
    picker
  },
  methods: {
    confirm (data, origin) {
      console.log(data);
      console.log(origin);
      // 清空opitons，避免第二次点击不显示组件
      this.options = [];
    },
    cancel () {
      this.options = [];
    },
    selectCity () {
      this.options = ['中国', '日本', '韩国', '美国', '英国', '泰国', '德国', '意大利', '阿根廷', '西班牙', '葡萄牙'];
      this.origin = 'city';
    },
    selectId () {
      this.options = [{text: '配偶', value: 0}, {text: '儿子', value: 1}, {text: '父亲', value: 2}, {text: '母亲', value: '3'}, {text: '女儿', value: '4'}];
      this.origin = 'id';
    }
  },
}