Неперехваченная ошибка типа: props.setDetailsShown не является функцией (useState)

#javascript #reactjs #react-hooks

#javascript #reactjs #реагирующие хуки

Вопрос:

Я передаю состояние в качестве реквизита, но когда я пытаюсь использовать setState , оно покажет это:

Неперехваченная ошибка типа: props.setDetailsShown не является функцией

Я перехожу отсюда:

 export function Topology() {
    const [ detailsShown, setDetailsShown ] = useState(false);
    
    return (
        <TopologyGraph detailsShown={setDetailsShown} />      
    );
}
  

Сюда:

 export function TopologyGraph(props) {

// graph event callbacks
const onClickNode = id => {
  console.log(`Clicked node ${id}`);
  props.setDetailsShown(true)
};
  

Ответ №1:

Вы переходите к TopologyGraph компоненту как detailsShown атрибут, поэтому попробуйте вызвать как:

 const onClickNode = id => {
  console.log(`Clicked node ${id}`);
  props.detailsShown(true)
};
  

Или переименуйте свой атрибут в setDetailsShown как:

 <TopologyGraph setDetailsShown={setDetailsShown} />
  

В конце ее можно вызвать как props.setDetailsShown(true) в вашей исходной onClickNode функции. Я лично предпочитаю второй вариант переименования, чтобы имя атрибута начиналось с set ключевого слова.

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

1. Спасибо! это был мой недостаток внимания

2. @YanVictor Никаких проблем, рад помочь!

Ответ №2:

Вы должны сделать props.detailsShown(true) так, detailsShown как имя реквизита, значение которого setDetailsShown равно.