У меня есть компонент Select, после щелчка на опции значение передается в родительский компонент.
У родительского компонента есть начальное значение для отображения приложения, но я бы хотел, чтобы значение было изменяется после получения нового значения через реквизит.
Мой дочерний компонент имеет onChange, который получает реквизит и передает его родителю
const AxesChoice = ({ legendChoice, xChoice, updateAxis, updateLegend }) => {
const [labels, updateLabels] = useState([])
const { Option } = Select
return (
<div>
<Select
key="legendChoice"
style={{ width: 250 }}
value={legendChoice}
onChange={event => {
updateLegend(event)
}}
>
{labels.map(items => (
<Option key={items} value={items.header}>
{items.label}
</Option>
))}
</Select>
</div>
)
}
В моем родительском компоненте отображается дочерний компонент как это
<AxesChoice
xChoice={axisChoice}
legendChoice={legendChoice}
updateAxis={updateAxisChoice}
updateLegend={updateLegendChoice}
/>
Значения начального состояния устанавливаются следующим образом
const [legendChoice, setLegendChoice] = useState('qualified')
Для обновления legendChoice у меня есть функция
const updateLegendChoice = event => {
console.log('fired', event)
// legendChoice = event
console.log('legendCHoice', legendChoice)
console.log('event', event)
setLegendChoice({ legendChoice: event })
console.log('newLegend', legendChoice)
axios
.get(`${BASE_URL}/${axisChoice}/${legendChoice}/${yearChoice}`)
.then(res => setState(res.data.data))
.catch(error => console.log(error))
console.log('newState', state)
}
В данный момент приложение вылетает парой предупреждений Uncaught Error: Objects are not valid as a React child (found: object with keys {legendChoice}). If you meant to render a collection of children, use an array instead.
Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
Я попытался обновить legendChoice
, выполнив это
setLegendChoice(event)
Однако это выводы
legendCHoice qualified
event role
newLegend qualified
Как правильно обновить состояние, если значение задано реквизитом?