Только обновлять дату, когда я изменяю чужое состояние, не следует обновлять или изменять ReactJS / React-Hooks - PullRequest
Новая
       33

Только обновлять дату, когда я изменяю чужое состояние, не следует обновлять или изменять ReactJS / React-Hooks

0 голосов
/ 25 сентября 2019

Благодаря новой концепции реагирующих хуков я хочу опубликовать некоторые данные, которые я использую useState future, поэтому, когда я изменяю дату, другие даты также обновляются в соответствии с тем, что я выбрал.Я хочу, чтобы это было обновление только связанной даты.если я изменил planRegisterStartDate, чтобы другие не влияли на то, как я могу это сделать, используйте пакет rere-datepicker 


const [planGroupData, setPlanGroupData] = useState({
    planGroupName: '',
    PlanGroupYear: '',
    planRegisterStartDate: new Date(),
    planRegisterFinishDate: new Date(),
    projeRegisterStartDate: new Date(),
    projeRegisterFinishDate: new Date()
  })

  const onPlanGroupDateChange = date => {
    setPlanGroupData({
      planRegisterStartDate: date,
      planRegisterFinishDate: date,
      projeRegisterStartDate: date,
      projeRegisterFinishDate: date
    })
  }
const {
    PlanGroupYear,
    planGroupName,
    planRegisterFinishDate,
    planRegisterStartDate,
    projeRegisterFinishDate,
    projeRegisterStartDate
  } = planGroupData

 return (
 <div className='form-row'>
          <DatePicker
            selected={planRegisterStartDate}
            onChange={onPlanGroupDateChange}
          />
 <DatePicker
            selected={planRegisterFinishDate}
            onChange={onPlanGroupDateChange}
          />
        </div>
)

1 Ответ

1 голос
/ 26 сентября 2019

Вы можете разделять свои состояния и определять функции по отдельности, а затем вызывать эти функции в соответствующих компонентах.По моему мнению, это будет более управляемым. 

const [planGroupName, setPlanGroupName] = useState(null)
const [planGroupYear, setPlanGroupYear] = useState(null)
const [planRegisterStartDate, setPlanRegisterStartDate] = useState(new Date())
const [planRegisterFinishDate, setPlanRegisterFinishDate] = useState(new Date())
const [projeRegisterStartDate, setProjeRegisterStartDate] = useState(new Date())
const [projeRegisterFinishDate, setProjeRegisterFinishDate] = useState(new Date())


<DatePicker selected={planRegisterStartDate}
            onChange={date => setPlanRegisterStartDate(date)} />
<DatePicker selected={planRegisterFinishDate} 
             onChange={date => setPlanRegisterFinishDate(date)} />
...