#javascript #reactjs
#javascript #reactjs
Вопрос:
У меня есть useState следующим образом:
const [Total, setTotal] = useState(props.location.state.data.price)
Я хотел бы, чтобы это было так, если определен props.location.state.data.price , он отображается, но если не определено, то возвращается 0.
Я пробовал нулевые операторы объединения, но это не работает. Любая помощь приветствуется. Спасибо
Комментарии:
1. какую ошибку он выдает при использовании нулевого объединения и как бы выглядел реквизит, если бы он был неопределенным
2. Необычно передавать props в state, если
data.price
не предполагается, что это какое-то значение по умолчанию.
Ответ №1:
Либо так:
const [Total, setTotal] = useState(props.location?.state?.data?.price ?? 0)
или вот так:
const [Total, setTotal] = useState(
props.location amp;amp;
props.location.state amp;amp;
props.location.state.data amp;amp;
props.location.state.data.price || 0
)
Ответ №2:
Вы, вероятно, хотели бы также обновить total
, если props.location.state.data.price
должно измениться в какой-то момент, верно? Так что я бы сделал это с эффектом:
const [total, setTotal] = useState(0)
useEffect(() => {
if (!props.location?.state?.data?.price) {
setTotal(0);
return;
}
setTotal(props.location.state.data.price);
}, [props.location.state.data.price])
Комментарии:
1. Проблема с этим заключается в том, что он всегда будет выполнять начальную фиксацию в DOM (или в дереве хостов),
0
а затем запланирует обновление с правильным значением. Таким образом, пользователь может видеть ноль, когда есть фактическая цена.2. Не говоря уже о том, что location может быть
null
, и тогда код внутри эффекта будет выдан…3. Согласен, я добавил «?» к проверке в ответе. К вашему второму пункту: да, это может произойти, нам нужно будет проверить полный пример, чтобы увидеть, является ли это проблемой