diff --git a/README.md b/README.md index d9e75647862c382ca3c2e41a1ac59de75006e6ce..f8998e56674df7805f1cfa784ed326a44fe91dad 100644 --- a/README.md +++ b/README.md @@ -39,6 +39,9 @@ Needs react-native >= 0.14.2 ####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 diff --git a/index.js b/index.js index 141bce575ce3d1202ed046dbe6a44dc75dbf6286..4c614db353b9c82c449bbb183e1c2ca148880004 100644 --- a/index.js +++ b/index.js @@ -147,7 +147,7 @@ export default class PickerAny extends React.Component { } _slideUp(){ - this.isMoving = true; + this._isMoving = true; Animated.timing( this.state.slideAnim, { @@ -156,14 +156,14 @@ export default class PickerAny extends React.Component { } ).start((evt) => { if(evt.finished) { - this.isMoving = false; - this.isPickerShow = true; + this._isMoving = false; + this._isPickerShow = true; } }); } _slideDown(){ - this.isMoving = true; + this._isMoving = true; Animated.timing( this.state.slideAnim, { @@ -172,17 +172,17 @@ export default class PickerAny extends React.Component { } ).start((evt) => { if(evt.finished) { - this.isMoving = false; - this.isPickerShow = false; + this._isMoving = false; + this._isPickerShow = false; } }); } _toggle(){ - if(this.isMoving) { + if(this._isMoving) { return; } - if(this.isPickerShow) { + if(this._isPickerShow) { this._slideDown(); } else{ @@ -193,6 +193,19 @@ export default class PickerAny extends React.Component { toggle(){ this._toggle(); } + show(){ + if(!this._isPickerShow){ + this._slideUp(); + } + } + hide(){ + if(this._isPickerShow){ + this._slideDown(); + } + } + isPickerShow(){ + return this._isPickerShow; + } _prePressHandle(callback){ //通知子组件往上滚 @@ -215,22 +228,21 @@ export default class PickerAny extends React.Component { } _renderParallelWheel(pickerData){ - let me = this; return pickerData.map((item, index) => { return ( { - me.pickedValue.splice(index, 1, value); + this.pickedValue.splice(index, 1, value); //do not set state to another object!! why? - // me.setState({ - // selectedValue: me.pickedValue + // this.setState({ + // selectedValue: this.pickedValue // }); - me.setState({ - selectedValue: JSON.parse(JSON.stringify(me.pickedValue)) + this.setState({ + selectedValue: JSON.parse(JSON.stringify(this.pickedValue)) }); - me.state.onValueChange(JSON.parse(JSON.stringify(me.pickedValue)), index); + this.state.onValueChange(JSON.parse(JSON.stringify(this.pickedValue)), index); }} > {item.map((value, index) => ( { - //on ios platform 'this' refers to Picker? - me.pickedValue.splice(2, 1, me.state.thirdWheelData[index]); - me.setState({ + this.pickedValue.splice(2, 1, this.state.thirdWheelData[index]); + this.setState({ thirdPickedDataIndex: index, selectedValue: 'wheel3'+index }); - me.state.onValueChange(JSON.parse(JSON.stringify(me.pickedValue)), 2); + this.state.onValueChange(JSON.parse(JSON.stringify(this.pickedValue)), 2); }} > - {me.state.thirdWheelData.map((value, index) => ( + {this.state.thirdWheelData.map((value, index) => ( { let secondWheelData = Object.keys(pickerData[value]); - let cascadeData = me._getCascadeData(pickerData, me.pickedValue, value, secondWheelData[0]); + let cascadeData = this._getCascadeData(pickerData, this.pickedValue, value, secondWheelData[0]); //when onPicked, this.pickedValue will pass to the parent //when firstWheel changed, second and third will also change if(cascadeData.thirdWheelData){ - me.pickedValue.splice(0, 3, value, cascadeData.secondWheelData[0], cascadeData.thirdWheelData[0]); + this.pickedValue.splice(0, 3, value, cascadeData.secondWheelData[0], cascadeData.thirdWheelData[0]); } else{ - me.pickedValue.splice(0, 2, value, cascadeData.secondWheelData[0]); + this.pickedValue.splice(0, 2, value, cascadeData.secondWheelData[0]); } - me.setState({ + this.setState({ selectedValue: 'wheel1'+value, firstPickedData: value, secondWheelData: cascadeData.secondWheelData, @@ -356,11 +366,11 @@ export default class PickerAny extends React.Component { thirdWheelData: cascadeData.thirdWheelData, thirdPickedDataIndex: 0 }); - me.state.onValueChange(JSON.parse(JSON.stringify(me.pickedValue)), 0); - me.refs.secondWheel && me.refs.secondWheel.moveTo && me.refs.secondWheel.moveTo(0); - me.refs.thirdWheel && me.refs.thirdWheel.moveTo && me.refs.thirdWheel.moveTo(0); + this.state.onValueChange(JSON.parse(JSON.stringify(this.pickedValue)), 0); + this.refs.secondWheel && this.refs.secondWheel.moveTo && this.refs.secondWheel.moveTo(0); + this.refs.thirdWheel && this.refs.thirdWheel.moveTo && this.refs.thirdWheel.moveTo(0); }} > - {me.state.firstWheelData.map((value, index) => ( + {this.state.firstWheelData.map((value, index) => ( { - let thirdWheelData = pickerData[me.state.firstPickedData][me.state.secondWheelData[index]]; + let thirdWheelData = pickerData[this.state.firstPickedData][this.state.secondWheelData[index]]; if(thirdWheelData){ - me.pickedValue.splice(1, 2, me.state.secondWheelData[index], thirdWheelData[0]); + this.pickedValue.splice(1, 2, this.state.secondWheelData[index], thirdWheelData[0]); } else{ - me.pickedValue.splice(1, 1, me.state.secondWheelData[index]); + this.pickedValue.splice(1, 1, this.state.secondWheelData[index]); } - me.setState({ + this.setState({ secondPickedDataIndex: index, thirdWheelData, thirdPickedDataIndex: 0, selectedValue: 'wheel2'+index }); - me.state.onValueChange(JSON.parse(JSON.stringify(me.pickedValue)), 1); - me.refs.thirdWheel && me.refs.thirdWheel.moveTo && me.refs.thirdWheel.moveTo(0); + this.state.onValueChange(JSON.parse(JSON.stringify(this.pickedValue)), 1); + this.refs.thirdWheel && this.refs.thirdWheel.moveTo && this.refs.thirdWheel.moveTo(0); }} > - {me.state.secondWheelData.map((value, index) => ( + {this.state.secondWheelData.map((value, index) => ( - 上一个 - 下一个 - - );*/ - // let pickerBtn = null; return (