nativerepo.com

rmc-picker


React Mobile Picker Component (web and react-native)

NPM version react-native react build status Test coverage gemnasium deps npm download

Screenshots

Development

npm i
npm start

Example

http://localhost:8000/examples/

online example: http://react-component.github.io/m-picker/

react-native

./node_modules/rc-tools run react-native-init
npm run watch-tsc
react-native start
react-native run-ios

install

rmc-picker

4.x beta docs

Usage

<MultiPicker
  selectedValue={this.state.value}
  onValueChange={this.onChange}
>
  <Picker indicatorClassName="my-picker-indicator">
    <Picker.Item className="my-picker-view-item" value="1">one</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="2">two</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="3">three</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="4">four</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="5">five</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="6">six</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="7">seven</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="8">eight</Picker.Item>
  </Picker>
  <Picker indicatorClassName="my-picker-indicator">
    <Picker.Item className="my-picker-view-item" value="11">eleven</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="12">twelve</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="13">thirteen</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="14">fourteen</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="15">fifteen</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="16">sixteen</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="17">seventeen</Picker.Item>
    <Picker.Item className="my-picker-view-item" value="18">eighteen</Picker.Item>
  </Picker>
</MultiPicker>

API

MultiPicker props

namedescriptiontypedefault
className(web)additional css class of root dom nodeString
prefixCls(web)prefix classString''
defaultSelectedValue(web)default selected valuesstring[]/number[]
selectedValuecurrent selected valuesstring[]/number[]
onValueChangefire when picker changeFunction(value)

Picker props

namedescriptiontypedefault
className(web)additional css class of root dom nodeString
prefixCls(web)prefix classString''
defaultSelectedValue(web)default selected valuesstring/number
selectedValuecurrent selected valuesstring/number
onValueChangefire when picker changeFunction(value)
disabledwhether picker is disabledboolfalse
indicatorClassNameclassName of indicatorString
indicatorStylestyle of indicatorobject

Picker.Item props

namedescriptiontypedefault
className(web)additional css class of root dom nodeString
valuevalue of itemString

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/ dir

License

rmc-picker is released under the MIT license.


Comments
Details
Added at: 2017/03/19
Owner: react-component
Category: other
Homepage: https://github.com/react-component/m-picker
Downloads last month: 9770
Version: 4.0.1
Compatibility
  •  
  •  

Add to your project

npm i --save rmc-picker
yarn add rmc-picker