前言

因项目需要，自己动手实现了一个下拉框组件，最近得空将控件独立出来开源上传到了github和npm。

github和npm上全英文的readme方便国际友人，这里就写个中文的吧。
如果您觉得对您有帮助请在github上给个Star，达到一定数量我将会把项目提交到awsome-react-native列表中。
如果您有问题可以以任何方式和我取得联系，也可以直接在github上提issue（推荐）。

react-native-modal-dropdown

一个react-native的下拉框组件，支持安卓和iOS。

在example里可以找到示例代码。

Sample 1 - Basic and custom

Sample 2 - Within scroll view

Sample 3 - Lazy load

npm i react-native-modal-dropdown --save

先Import组件:

import ModalDropdown from 'react-native-modal-dropdown';

作为组件使用即可:

<ModalDropdown options={['option 1', 'option 2']}/>

可以通过传入以下样式属性来自定义样式:

可以通过实现renderRow方法来自定义下拉框中的选项行。

Prop	Type	Optional	Default	Description
`disabled`	bool	Yes	false	是否禁用组件
`defaultIndex`	number	Yes	-1	初始选择。 -1: 未选中。这个只会影响选项展示的高亮与否，不会改变初始的按钮文字。若要改变按钮初始文字请参考`defaultValue`。
`defaultValue`	string	Yes	Please select...	按钮初始文字。
`options`	arrayOf(string)	Yes		选项。传`null`/`undefined`则下拉框会显示一个加载图标。
`style`	object	Yes		按钮样式。
`textStyle`	object	Yes		按钮文字样式。
`dropdownStyle`	object	Yes		下拉框样式。
`renderRow`	func	Yes		自定义选项行的渲染。传`null`/`undefined`会使用默认的行渲染。
`onDropdownWillShow`	func	Yes		下拉框显示前触发。若实现此方法并返回`false`可以阻止显示。
`onDropdownWillHide`	func	Yes		下拉框隐藏前触发。若实现此方法并返回`false`可以阻止隐藏。
`onSelect`	func	Yes		选择选项时触发并返回`index`和`value`。若实现此方法并返回`false`可以阻止选择。

Method	Description
`updatePosition()`	手动更新下拉框位置。如果控件放在scroll view里面，需要在`scrollView`的`onScroll`方法中调用此方法。
`show()`	显示下拉框。不会触发`onDropdownWillShow`。
`hide()`	隐藏下拉框。不会触发`onDropdownWillHide`。
`select(idx)`	选择给定索引（`idx`）的选项。不会触发`onSelect`。

受到d-a-n/react-native-modal-picker的启发，下个版本将实现控件作为容器！逮谁谁怀孕变成下拉框按钮。