Reactjs react dom.production.min.js:216类型错误：无法读取属性'；拆分'；生产环境的不确定性

每次我将react应用程序部署到Heroku时都会遇到此问题：

const TodoSuggestion=（）=>{
const classes=useStyles（）；
常量{register，handleSubmit，errors，setValue}=useForm（）；
const[navData，setNavData]=使用状态（建议使用导航条数据）；
const onSubmit=（数据）=>{
console.log（数据）
}
React.useffect（（）=>{
登记册（“全名”）；
登记册（“todoTitle”）；
注册（“ToDeDescription”）；
}[登记册]）
返回(
把你有创意的待办事项寄给我
发送请求
);
}
将默认值导出到Dosuggestion；

知道是什么问题吗？但是，代码在本地工作，一旦部署到Heroku，就会生成上述错误。我已经搜索了一个smiliar错误，但无法解决该问题

我正在使用以下构建包：

---

我发现一个问题可能是组件正在加载多次。但是，即使包含useEffect，同样的错误仍然会发生。

查看您的代码示例，我认为您使用的是带有react钩子表单的material ui

我发现了两个问题，我希望这将对您有所帮助

您不需要

useffect

部分

React.useffect（（）=>{
登记册（“全名”）；
登记册（“todoTitle”）；
注册（“ToDeDescription”）；
}[登记册]）

物料界面不需要此部件

只需使用

inputRef

，而不是

ref

将代码设置为

---

查看您的代码示例，我认为您使用的是带有react hook表单的material ui

我发现了两个问题，我希望这将对您有所帮助

您不需要

useffect

部分

React.useffect（（）=>{
登记册（“全名”）；
登记册（“todoTitle”）；
注册（“ToDeDescription”）；
}[登记册]）

物料界面不需要此部件

只需使用

inputRef

，而不是

ref

将代码设置为

我所做的是删除ref={register（{required:true}}），并保持inputRef的原样，然后它就工作了。谢谢你。我所做的是删除了ref={register（{required:true}}），并保持inputRef的原样，它工作了。谢谢你。

const TodoSuggestion = () => {
    const classes = useStyles();
    const {register, handleSubmit, errors, setValue} = useForm();
    const [navData, setNavData] = useState(SUGGEST_NAVBAR_DATA);

    const onSubmit = (data) => {
        console.log(data)
    }

    React.useEffect(() => {
        register("fullName");
        register("todoTitle");
        register("todoDescription");
    }, [register])

    return (
        <div>
            <Navbar navData={navData}></Navbar>
            <div style={{display: 'flex', justifyContent: 'center', alignItems: 'center', height: '50vh'}}>
                <form onSubmit={handleSubmit(onSubmit)}>
                    <Grid container spacing={2}>
                        <Grid item xs={12}>
                            <Typography variant="h6" className={classes.Typography}>
                                <Box m={1} letterSpacing={6}>
                                    Send Me Your Creative Todo Ideas
                                </Box>
                            </Typography>
                        </Grid>
                        <ThemeProvider theme={theme}>
                            <Grid item xs={12}>
                                <TextField
                                    className={classes.margin}
                                    label="Your Full Name"
                                    variant="outlined"
                                    id="fullName"
                                    ref={register({required: true})}
                                    inputRef={register} name="fullName"
                                />
                            </Grid>
                            <Grid item xs={12}>
                                <TextField
                                    className={classes.margin}
                                    label="Title of the Todo"
                                    variant="outlined"
                                    id="todoTitle"
                                    ref={register({required: true})}
                                    inputRef={register} name="todoTitle"
                                />
                            </Grid>
                            <Grid item xs={12}>
                                <TextField
                                    className={classes.margin}
                                    label="Description of the Todo"
                                    variant="outlined"
                                    id="todoDescription"
                                    ref={register({required: true})}
                                    inputRef={register} name="todoDescription"
                                />
                            </Grid>
                        </ThemeProvider>
                    </Grid>
                    <BootstrapButton variant="contained" style={{backgroundColor: "darkslategray"}} disableRipple type="submit"
                                     className={classes.margin}>
                        <WhiteTextTypography variant="h6" className={classes.title}>
                            <Box m={1} letterSpacing={6}>
                                Send Request
                            </Box>
                        </WhiteTextTypography>
                    </BootstrapButton>
                </form>
            </div>
        </div>
    );

}



export default TodoSuggestion;