React Native不会显示来自TextInput的Datepicker

我想知道是否可以在按下TextInput时显示datepicker模式。React Native不会显示来自TextInput的Datepicker

我正在使用TouchableWithoutFeedback和TextInput。如果我使用Text，它运行良好，但是当我使用TextInput时，datepicker模式不显示。

我使用TextInput的原因是因为我想使用underlineColorAndroid支柱。

下面的代码

showPicker = async (stateKey, options) => { 
    try { 
     const newState = {}; 
     const { action, year, month, day } = await DatePickerAndroid.open(options); 
     if (action === DatePickerAndroid.dismissedAction) { 
     newState[stateKey + 'Text'] = 'dismissed'; 
     } else { 
     const date = new Date(year, month, day); 
     newState[stateKey + 'Text'] = date.toLocaleDateString(); 
     newState[stateKey + 'Date'] = date; 
     } 
     this.setState(newState); 
    } catch ({ code, message }) { 
     console.warn(`Error in example '${stateKey}': `, message); 
    } 
    }; 

<TouchableWithoutFeedback 
      onPress={this.showPicker.bind(this, 'simple', { date: this.state.simpleDate })} 
      > 
      <TextInput 
       placeholder="Where the event held*" 
       onFocus={() => this.onFocus()} 
       onFocus={() => this.onFocus()} 
       style={{ 
       height: 60, backgroundColor: this.state.backgroundColor, color: this.state.color 
       }} 
       value={this.state.simpleText} 
      /> 
      </TouchableWithoutFeedback>

的目标是每当我按下/点击TextInput，它会弹出日期选择器模态了，然后我可以选择从模式的日期。

来源

2017-02-09 Webster

你只需要调用showPicker函数onFocus支持TextInput。像这样：

<TextInput onFocus = {this.showPicker.bind(this, 'simple', { date: this.state.simpleDate })}>

请原谅我，如果我的想法不符合您的目标。

来源

2017-02-09 09:06:27

嗨，谢谢，它的工作原理，但..文本输入仍然可编辑，我试图将可编辑设置为false，但showPicker函数没有触发。 – Webster

嗨，你可以尝试从'dismissKeyboard'中导入DismissKeyboard;'并在onFocus'props'中调用'DismissKeyboard（）'函数。 –

好吧伙计，你救了我的一天。谢谢！！ – Webster

React Native不会显示来自TextInput的Datepicker

回答

相关问题