2016-09-22 14:34:01 +08:00
2016-09-22 14:34:01 +08:00
2016-09-22 11:25:21 +08:00
2016-09-22 11:25:21 +08:00
2016-09-21 20:24:35 +08:00
2016-05-26 15:12:33 +08:00
2016-05-26 15:12:33 +08:00
2016-09-22 14:34:01 +08:00
2016-09-21 20:32:36 +08:00
2016-09-22 14:34:01 +08:00

react-native-picker

npm version dependency status

For pure javascript version -> v3.0.5

ui2

###Documentation

####Props

  • pickerConfirmBtnText(string), 确认按钮文字
  • pickerCancelBtnText(string), 取消按钮文字
  • pickerTitleText(string), 标题文字
  • pickerConfirmBtnColor([1, 186, 245, 1]), 确认按钮字体颜色
  • pickerCancelBtnColor([1, 186, 245, 1]), 取消按钮字体颜色
  • pickerTitleColor([20, 20, 20, 1]), 标题字体颜色
  • pickerToolBarBg([232, 232, 232, 1]), 工具栏背景颜色
  • pickerBg([196, 199, 206, 1]), picker背景颜色
  • pickerData(array), picker数据
  • selectedValue(string),默认选中数据
  • onPickerConfirm(function),确认按钮回调
  • onPickerCancel(function),取消按钮回调
  • onPickerSelect(function),滚轮滚动时回调

####Methods

  • toggle show or hide picker, default to be hiden
  • show show picker
  • hide hide picker
  • isPickerShow get status of picker, return a boolean

###Usage

####Step 1 - install

	npm install react-native-picker --save

####Step 2 - link

	react-native link

####Step 3 - import and use in project

	import Picker from 'react-native-picker';

	let data = [];
    for(var i=0;i<100;i++){
        data.push(i);
    }

    Picker.init({
        pickerData: data,
        selectedValue: [59],
        onPickerConfirm: data => {
            console.log(data);
        },
        onPickerCancel: data => {
            console.log(data);
        },
        onPickerSelect: data => {
            console.log(data);
        }
    });
    Picker.show();
	

###Notice

####support two modes:

1. parallel: such as time picker, wheels have no connection with each other

2. cascade: such as date picker, address picker .etc, when front wheel changed, the behind wheels will all be reset

####parallel:

  • single wheel:
	pickerData = [1,2,3,4];
	selectedValue = 3;
  • two or more wheel:
	pickerData = [
		[1,2,3,4],
		[5,6,7,8],
		...
	];
	selectedValue = [1, 5];

####cascade:

  • two wheel
    pickerData = [
        {
            a: [1, 2, 3, 4]
        },
        {
            b: [5, 6, 7, 8]
        },
        ...
    ];
    selectedValue = ['a', 2];
  • three wheel
    pickerData = [
        {
            a: [
                {
                    a1: [1, 2, 3, 4]
                },
                {
                    a2: [5, 6, 7, 8]
                },
                {
                    a3: [9, 10, 11, 12]
                }
            ]
        },
        {
            b: [
                {
                    b1: [11, 22, 33, 44]
                },
                {
                    b2: [55, 66, 77, 88]
                },
                {
                    b3: [99, 1010, 1111, 1212]
                }
            ]
        },
        {
            c: [
                {
                    c1: ['a', 'b', 'c']
                },
                {
                    c2: ['aa', 'bb', 'cc']
                },
                {
                    c3: ['aaa', 'bbb', 'ccc']
                }
            ]
        },
        ...
    ]
Description
No description provided
Readme 896 KiB
Languages
Java 58.7%
Objective-C 32.5%
JavaScript 7.1%
Starlark 1.2%
Ruby 0.5%