反应本机日期范围

Question

import React, {useState} from "react";
import { StyleSheet, View, Text } from "react-native";
import { globalStyles } from "../styles/global";
import {Calendar, CalendarList, Agenda} from 'react-native-calendars';
import {LocaleConfig} from 'react-native-calendars';
import  moment  from  "moment";
import DateRangePicker from "react-native-daterange-picker";

export default function About(){
    const [endDate, setendDate] = useState(null)
    const [startDate, setstartDate] = useState(null)
    const [displayedDate, setdisplayedDate] = useState(moment())

    state = {
        endDate: null,
        startDate: null,
        displayedDate: moment()
    };

    const handleSubmit = (props) => {

        console.log(props);
        setendDate(props.endDate);
        setstartDate(props.startDate);
        setdisplayedDate(props.displayedDate);
        // console.log(props.startDate);
        // console.log(props.displayedDate);
    }

    return(
        <View style={globalStyles.container}>

        <DateRangePicker
          onChange={ handleSubmit }
          endDate={endDate}
          startDate={startDate}
          displayedDate={displayedDate}
          range>
          <Text>Click me!</Text>
          </DateRangePicker>

        </View>
    )
}

1.无法选择日期范围。 2. undefined is not an object（评估displayedDate.format） 3. 使用函数组件，但大多数解决方案都可以使用类组件

Answer 1

你可以如下调用handleSubmit onChang={() => 处理提交()}

并且函数原型中不需要props参数 const handleSubmit = (props) => {} 因为 props 已经声明了，你不需要将它设置为参数。 如果你想用它作为参数，那么你应该像这样改变 onChange={() => handleSubmit(props)}

希望对你有所帮助。