Блог

Главная - Вопросы по программированию - При изменении состояния нужный компонент не отображается в React

При изменении состояния нужный компонент не отображается в React

#javascript #reactjs #react-hooks

Вопрос:

Я пытаюсь отобразить отключенный ввод, когда состояние не содержит необходимого значения, и когда оно включает компонент удалить отключенный ввод и отобразить теги реакции:

 useEffect(() => {
    console.log(professionals);

    if(professionals.length){
        clickSearch();
    }
}, [page, professionals]);
    
 
 <div className="column is-6">
    {
       !professionals.includes(item => item.value ==='programmers') ?
           <BaseInput disabled placeholder="usernames"></BaseInput> :
           <ReactTags
               tags={users}
               placeholderText={!users.length?"Search ...":''}
               allowNew={true}
    
               onDelete={(i)=> {
                   const tags = users.slice(0)
                   tags.splice(i, 1)
                   setUsers(tags)
               }}

               onAddition={ (tag) =>{
                   const tags = [].concat(users, tag)
                   setUsers(tags)
               }}
           />
    }      
</div>

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

Ответ №1:

Включает не работает для объектов. Вы можете использовать some filter функции или для этой цели.

Пример с filter :

 !!professionals.filter(item => item.value ==='programmers').length

Пример с some :

 professionals.some(item => item.value ==='programmers')

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

1. @TusharShahi спасибо, что указали на это.

2. @NewTechLover не могли бы вы поместить свой код в codesandbox , чтобы мы могли его проверить?

Ответ №2:

.includes() не принимает функцию. Вы ищете .некоторые() ?

 !professionals.some(item => item.value ==='programmers' ? ...
Метки: