@uiw/react-native/lib/DatePicker/component/PickerView.js

UIW for React Native

import React, { useState, useEffect } from 'react';
import { View, StyleSheet, Text } from 'react-native';
import Picker from '../../Picker';

// export interface PickerDate {
//   label?: string;
//   render?: (key: string, record: PickerData, index: number) => React.ReactNode;
//   [key: string]: any;
// }
var DateObject;
(function (DateObject) {
  DateObject["year"] = "\u5E74";
  DateObject["month"] = "\u6708";
  DateObject["day"] = "\u65E5";
  DateObject["hour"] = "\u65F6";
  DateObject["minute"] = "\u5206";
  DateObject["second"] = "\u79D2";
})(DateObject || (DateObject = {}));
const PickerView = props => {
  const {
    title,
    showTitle,
    titleStyle,
    renderTitle,
    getTypeDate,
    value,
    onScrollEnd,
    ...other
  } = props;
  const textStyle = StyleSheet.flatten([styles.textStyle, titleStyle]);
  const [state, setState] = useState(0);
  useEffect(() => {
    setState(value || 0);
  }, [value]);
  useEffect(() => {
    getTypeDate(state, other.data?.[state]?.label, title);
  }, [state]);
  return <View style={{
    flex: 1
  }}>
      {showTitle && (renderTitle ? renderTitle(DateObject[title]) : <View style={styles.viewStyle}>
            <Text style={textStyle}>{DateObject[title]}</Text>
          </View>)}
      <Picker {...other} value={state} onChange={val => setState(val)} />
    </View>;
};
const styles = StyleSheet.create({
  viewStyle: {
    height: 50,
    alignItems: 'center',
    justifyContent: 'center',
    borderTopWidth: 1,
    borderTopColor: '#E6E6E6'
  },
  textStyle: {
    fontSize: 18,
    color: '#000',
    paddingVertical: 0,
    paddingHorizontal: 0
  }
});
export default PickerView;