Javascript 如何在useState钩子中将字符串转换为数字？

我试图在输入数据之前将数据从字符串转换为数字，以便以后可以对数据执行数学计算

我试图在useState钩子中使用parseInt，但收到以下错误： 引用错误：在初始化之前无法访问词法声明“score”

import React，{Fragment，useState}来自'React'；
从'react router dom'导入{Link}；
从“道具类型”导入道具类型；
从'react redux'导入{connect}；
从“../../actions/game”导入{addGame}；
const GameInput=（{addGame}）=>{
常量[formData，setFormData]=useState({
分数：parseInt（分数，10），
罢工：parseInt（罢工，10），
备件：parseInt（备件，10），
openFrames:parseInt（openFrames，10），
});
//对表单数据进行解构
const{score、strike、备件、openFrames}=formData；
//改变状态的输入法
const onChange=（e）=>
setFormData（{…formData，[e.target.name]：e.target.value}）；
//无委托形式法
const onSubmit=（e）=>{
e、 预防默认值（）；
addGame（formData）；
};
返回(
记录你的数据
onSubmit（e）}>
onChange（e）}
/>
你这场比赛的分数
onChange（e）}
/>
#这场比赛中有很多次的打击
onChange（e）}
/>
#我打这场比赛有多少次机会
onChange（e）}
/>
#带固定销的框架
返回配置文件
);
};
GameInput.propTypes={
addGame:PropTypes.func.isRequired，
};
导出默认连接（null，{addGame}）（GameInput）；

该状态尚未定义，因此无法访问。您正在设置初始状态，因此只需使用所需的类型声明它<代码>分数，

罢工

，

备件

，以及

开放框架

尚未声明或定义，因此无法使用

似乎您真的想在更新状态时将输入字符串解析回数字类型。为了保持状态不变，您可以/应该在

onChange

处理程序中进行此转换

// Input Method to change state
const onChange = (e) => {
  const { name, value } = e.target;
  setFormData({ ...formData, [name]: parseInt(value, 10) }); // Or Number(value)
};

提供有效的初始状态

const [formData, setFormData] = useState({
  score: 0,
  strikes: 0,
  spares: 0,
  openFrames: 0,
});

---

该状态尚未定义，因此无法访问。您正在设置初始状态，因此只需使用所需的类型声明它<代码>分数，

罢工

，

备件

，以及

开放框架

尚未声明或定义，因此无法使用。您已经创建了一个逻辑上不可能。创建

formData

需要使用

score

，创建

score

需要使用

formData

。实际数据从何而来？@David它是用户在客户端的表单中输入的。@tydangelo18：在表单呈现之前不是。你的意思是将初始值设置为默认值吗？@David最初在我的useState钩子中，初始状态是空字符串。谢谢你！

const [formData, setFormData] = useState({
  score: 0,
  strikes: 0,
  spares: 0,
  openFrames: 0,
});