У меня есть раздел с разными полями и т. д., которые в основном являются просто параметрами, когда мне нужно получить данные.
Итак, в основном структура примерно такая:
<form onSubmit = {fetchData}>
some parameter fields
</form>
Например, одним из параметров, который можно изменить, является дата, что я могу сделать, уменьшив или увеличив дату с сегодняшнего дня на один день, например:
<button onClick = {decreaseDate}>
-
</button>
<input
type = "number"
max = "1"
value = {incrementDate}
onChange = {onChangeDate}
/>
<button onClick = {increaseDate}>
+
</button>
куда:
const [incrementDate, setIncrementDate] = useState(0);
const increaseDate = () => {
setIncrementDate(incrementDate + 1);
};
const decreaseDate = () => {
setIncrementDate(incrementDate - 1);
};
const onChangeDate = ({ target }) => {
const { value } = target;
const attemptedParse = parseInt(value);
if (!Object.is(NaN, attemptedParse)) {
setIncrementDate(attemptedParse);
}
};
Таким образом, в основном это изменяет дату для данных, которые необходимо получить, когда я нажимаю кнопку отправки:
<button type = "submit">
Get data
</button>
Насколько я понимаю, функция fetchData
вызывается только в onSubmit
из form
. Однако проблема в том, что всякий раз, когда я нажимаю кнопку уменьшения или увеличения, новые данные извлекаются с новым значением даты. Таким образом, вместо того, чтобы нажимать кнопку отправки, он просто автоматически извлекает новые данные. И это не предусмотрено в данном случае. Мне бы очень хотелось, чтобы он извлекал новые данные всякий раз, когда я нажимаю кнопку отправки.
Я делаю что-то не так, или...?
Вот простое исправление:
<button type = "button" onClick = {decreaseDate}>
-
</button>
<input type = "number" max = "1" value = {incrementDate} onChange = {onChangeDate}/>
<button type = "button" onClick = {increaseDate}>
+
</button>
дайте мне знать, если это работает.
Ха-ха, мы все иногда делаем это, рад, что это помогло :)
Я даже не знаю, что сказать. Это, пожалуй, самая глупая ошибка, которую я совершил. Спасибо :)