使用ReactJS TypeScript MUI，利用useState设置TextField的值并为TextField添加onchange事件函数
<p>我是一个新手，正在使用ReactJS和MUI开发，有一个ReactJS TypeScript与MuiText字段表单。希望能够使用<code>useState</code>方法来改变文本字段的值。</p>
<p>同时为文本字段添加<code>onchnage</code>函数。我可以为普通的文本字段添加onchange函数，但不确定如何为MUI文本字段添加它？</p>
<pre class="brush:php;toolbar:false;">从 'react' 导入 * as React;
从“react”导入{useState}
从“@mui/material/Button”导入按钮；
从 '@mui/material/CssBaseline' 导入 CssBaseline；
从 '@mui/material/TextField' 导入 TextField；
从“@mui/material/Grid”导入网格；
从 '@mui/material/Box' 导入 Box；
从“@mui/material/Container”导入容器；
从 '@mui/material/styles' 导入 { createTheme, ThemeProvider };
从 'react-hook-form' 导入 { useForm, SubmitHandler, Controller };
从 'yup' 导入 * as yup；
从 '@hookform/resolvers/yup' 导入 { yupResolver }；
接口 IFormInputs {
文件路径：字符串；
}
const schema = yup.object().shape({
文件路径： yup.string().min(4).required(),
});
const 主题 = createTheme();
导出默认函数 MuiTextField() {
常量{
控制，
处理提交，
表单状态：{错误}，
} = useForm({
解析器： yupResolver(schema),
});
const [文件路径，setFilepath] = useState(“vodeo.mp3”);
const onSubmit: SubmitHandler; =（数据）=> {
console.log('数据提交：', data);
console.log('文件路径：', data.filepath);
};
返回 （
<容器组件=“main” maxWidth=“lg”>
