无法在datepicker react-native中显示占位符

Question

<DatePicker
                                        date={this.state.bdate}
                                        mode="date"
                                        placeholder="Select your birthday"
                                        format="YYYY-MM-DD"
                                        showIcon = {false}
                                        customStyles={{
                                            dateInput:{
                                                borderWidth: 0,
                                                paddingRight: 25,
                                            },
                                            dateText: {
                                                fontSize: 14,
                                                color: 'white'
                                            }
                                        }}
                                        confirmBtnText="Подтвердить"
                                        cancelBtnText="Отмена"
                                        onDateChange={this.handleDate}
                                    />

占位符道具实际上并不起作用，而是显示了今天的日期。

Answer 1

Please check lib https://github.com/xgfe/react-native-datepicker

The placeholder show when this.props.date is false. Please try following code.

<DatePicker
     date=""
     mode="date"
     placeholder="Select your birthday"
     format="YYYY-MM-DD"
     showIcon = {false}
     customStyles={{
              dateInput:{
              borderWidth: 0,
              paddingRight: 25,
     },
         dateText: {
             fontSize: 14,
             color: 'white'
        }
     }}
     confirmBtnText="Подтвердить"
     cancelBtnText="Отмена"
     onDateChange={this.handleDate}

/>

Answer 2

As mentioned in the doc, The placeholder show only when this.props.date is false. So in constructor make this.state = { bdate: ''} and follow your rest of code.

                                 <DatePicker
                                        date={this.state.bdate}
                                        mode="date"
                                        placeholder="Select your birthday"
                                        format="YYYY-MM-DD"
                                        showIcon = {false}
                                        customStyles={{
                                            dateInput:{
                                                borderWidth: 0,
                                                paddingRight: 25,
                                            },
                                            dateText: {
                                                fontSize: 14,
                                                color: 'white'
                                            }
                                        }}
                                        confirmBtnText="Подтвердить"
                                        cancelBtnText="Отмена"
                                        onDateChange={this.handleDate}
                                    />