Есть функция, которая в зависимости от условия рендерит определенный массив цветов, в зависимости от выбранной категории. Условия простое - если такой-то props === true, то функция должна сработать и отобразить необходимый set. Но не работает.
Вот функция:
displayColors = (colorSet) => {
colorSet.map((color, index) => {
return (
<li className={"filter-item " + (this.state.color === color ? "active-item" : null)} key={index}
onClick={() => this.handleFilter("color", color)}> {color} </li>
)
})
}
Эта же функция вызывает функцию handleFilter, которая берет необходимые значение, изменяет состояние, и выводит на экран необходимую категорию.
handleFilter = (name, value) => {
this.setState ({
[name]: value
}, this.sortData)
}
И вот так выглядит условие:
<ul className = {"filter-list colors-list " + (colorFilter ? "color-container-visible" : null)}>
{(categoryOneColors ? displayColors(colorSet) : null )}
{(categoryTwoColors ? displayColors(colorSet2) : null )}
...
...
</ul>
На выходе получается пустота, но если хардкодить условие в ручную, без функции - то все работает отлично. В чем проблема?
Простой