Q群 567530369,小伙伴们都在这里等你哦~

DatePickerIOS

使用DatePickerIOS来在 iOS 平台上渲染一个日期/时间选择器。这是一个受约束的(Controlled)组件,所以你必须监听onDateChange回调函数并且及时更新date属性来使得组件更新,否则用户的修改会立刻被撤销来确保当前显示值和props.date一致。

示例


import React, { Component } from 'react'
import {
  DatePickerIOS,
  View,
  StyleSheet,
} from 'react-native'

export default class App extends Component {
  constructor(props) {
    super(props);
    this.state = { chosenDate: new Date() };

    this.setDate = this.setDate.bind(this);
  }

  setDate(newDate) {
    this.setState({chosenDate: newDate})
  }

  render() {
    return (
      <View style={styles.container}>
        <DatePickerIOS
          date={this.state.chosenDate}
          onDateChange={this.setDate}
        />
      </View>
    )
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center'
  },
})

查看 Props


文档

Props

date

当前被选中的日期。

类型必填
Date

onDateChange

日期/时间变化的监听函数。

当用户修改日期或时间时调用此回调函数。唯一的参数是一个日期对象,表示新的日期和时间。

类型必填
function

maximumDate

可选的最大日期。

限制可选的日期/时间范围。

类型必填
Date

Example with maximumDate set to December 31, 2017:


minimumDate

可选的最小日期。

限制可选的日期/时间范围。

类型必填
Date

See maximumDate for an example image.


minuteInterval

可选的最小的分钟单位。

类型必填
enum(1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30)

Example with minuteInterval set to 10:


mode

选择器模式。

类型必填
enum('date', 'time', 'datetime')

Example with mode set to date, time, and datetime:


locale

The locale for the date picker. Value needs to be a Locale ID.

类型必填
String

timeZoneOffsetInMinutes

时区差,单位是分钟。

默认情况下,选择器会选择设备的默认时区。通过此参数,可以指定一个时区。举个例子,要使用北京时间(东八区),可以传递 8 * 60。

类型必填
number