如何首先從 API 的資料中獲取作為初始值的值，然后在用戶開始鍵入或洗掉文本時進行更改？
import React, {useState} from 'react'
const MyInput = () => {
const [counter, setCounter] = useState(0)
const initial = dataFromApi.length
const total = 1000
const counterChange = (e) => {
setCounter(initial.length e.target.value.length)
}
return(
<>{counter}/{total}<input defaultValue={dataFromApi} onChange={counterChange}/></>
)
}
export default MyInput
https://codesandbox.io/s/compassionate-napier-3nekx?file=/src/App.js
uj5u.com熱心網友回復：
將初始長度傳遞給 useState 鉤子
const initial = dataFromApi.length
const [counter, setCounter] = useState(initial)
如果您希望 API 資料更改，則可以使用 useEffect 鉤子在 API 資料更改時重置長度狀態
useEffect(() => {
setCounter(dataFromApi.length);
}, [dataFromApi.length]);
如果要顯示輸入文本的當前長度，則無需在 onChange 處理程式中添加初始值
setCounter(e.target.value.length)
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/333479.html
標籤：javascript 反应 反应钩子 javascript 事件
上一篇：反應排序在第一次嘗試時不起作用
下一篇：UseEffect多次重新渲染