Используйте значение для установки значения true или false из родительского компонента

#reactjs

Вопрос:

У меня есть родительский компонент, который не может отправить значение, возвращающее значение true или false его дочернему компоненту

 //Parent
const disableButton = reservationsSchedule amp;amp; reservationsSchedule.includes(schedule.id)
return  <ScheduleLine disableButton={disableButton}  />    
        
 

Затем, в его дочернем элементе, я хочу установить значение true вместо false в зависимости от кнопки отключения
Я пробую многое, например :

 const [disabled, setDisabled] = useState(disableButton)
    console.log(disableButton, "disableButton1")

    useEffect(() => {
     
        console.log(disableButton amp;amp; disableButton, "disableButton2")
        setDisabled(disableButton)
      
    }, [])
 

Но это не работает. Первая консоль.журнал disableButton1 вернул мне значение true вместо false, но не установил значение DISABLED в значение true. И вторая консоль.журнал disableButton2 всегда равен нулю.

Должен ли я использовать useEffect в этом случае ? Еще одно условие ?

Комментарии:

1. Можете ли вы показать остальную часть кода для ребенка? Также вы хотите, чтобы ребенок мог установить свойство «отключено»?

Ответ №1:

Вам нужно передать свою опору (кнопку отключения) в useEffect. Таким образом, он запускается каждый раз, когда опора обновляется.

 const [disabled, setDisabled] = useState(disableButton)
console.log(disableButton, "disableButton1")

useEffect(() => {
 
    console.log(disableButton amp;amp; disableButton, "disableButton2")
    setDisabled(disableButton)
  
}, [disableButton])
 

Ответ №2:

В вашем ребенке вам нужно добавить кнопку отключения внутри второго параметра, чтобы использовать эффект в качестве зависимости, которая сообщит useEffect, что всякий раз, когда значение кнопки отключения изменяется, запускайте useEffect.

пустой массив означает, что он будет выполняться только при монтировании, а не всякий раз, когда происходит какое-либо обновление.

 useEffect(() => {
  console.log(disableButton amp;amp; disableButton, "disableButton2")
  setDisabled(disableButton)  
}, [disableButton])