2.5.3 • Published 4 years ago

vue-pickers v2.5.3

Weekly downloads
294
License
ISC
Repository
github
Last release
4 years ago

中文 | English

vue-picker的组件,囊括了(普通选择联动选择中国地址选择)等等常见的picker,兼容PC、移动端,通过简单配置就可以出现一个强大的picker,感受下效果图。

vue-pick.gif

Demo(快点去复制代码体验一波吧)

https://naihe138.github.io/vue-picker/index.html

Install

npm install vue-pickers --save or yarn add vue-pickers

使用

普通网页开发直接复制lib/vue-picker.js文件夹到项目即可直接使用

<template>
  <div>
    <button @click="show">show picker</button>
    <VuePicker :data="pickData"
      :showToolbar="true"
      @cancel="cancel"
      @confirm="confirm"
      :visible.sync="pickerVisible"
    />
  </div>
</template>

<script>
  import VuePicker from 'vue-pickers'
  var tdata = []
  for (let i = 0; i < 20; i++) {
    tdata.push({
      label: '第' + i + '行',
      value: i
    })
  }
  export default {
    components: {
      VuePicker
    },
    data () {
      return {
        pickerVisible: false,
        pickData: [
          tdata
        ],
        result: ''
      }
    },
    methods: {
      show () {
        this.pickerVisible = true
      },
      cancel () {
        this.result = 'click cancel result: null'
      },
      confirm (res) {
        this.result = JSON.stringify(res)
      }
    }
  }
</script>

属性参数说明

参数说明是否必须类型默认值
visible显示/隐藏pickerBooleanfalse
datapickerData,多列data1, data2Array[]
layer联动显示列数Number0
defaultIndex默认显示的indexNumber/Array(多列用数组)
cancelText取消按钮文字String'取消'
confirmText去确认按钮文字String'确认'
titlepicker标题String''
showToolbar显示头部Booleanfalse
maskClick遮罩层是否可以点击关闭Booleanfalse
itemHeight每一行的高度Number, String'44px'
rowNumber显示多少行(建议单数)Number5
appendToBody是否插入到body中Booleanfalse

事件说明

参数说明是否必须类型默认值
change数据变化事件function(val)
cancel取消选择function
confirm确认选择function(val)
2.5.3

4 years ago

2.5.2

4 years ago

2.5.1

4 years ago

2.4.1

4 years ago

2.3.1

4 years ago

2.3.0

4 years ago

2.2.0

4 years ago

2.1.3

4 years ago

2.1.2

4 years ago

2.1.1

4 years ago

2.1.0

4 years ago

2.0.1

4 years ago

2.0.0

4 years ago

1.1.5

6 years ago

1.1.4

6 years ago

1.1.3

6 years ago

1.1.2

6 years ago

1.1.1

6 years ago

1.0.7

6 years ago

1.0.6

6 years ago

1.0.5

6 years ago

1.0.4

6 years ago

1.0.3

7 years ago

1.0.2

7 years ago

1.0.1

7 years ago

1.0.0

7 years ago