如何在[]外使用useFormState> 我将react-admin v2.0升级到3.0,我遵循了此guide。 我在react-final-form和jest测试中遇到问题。 我在按钮上执行了自定义逻辑,我需要表单值,因此我使用了useFormState中的react-final-form。它在应用程序上正常工作,但是运行jest测试时出现错误。 这是我在组件中的代码 import { Button } from '@material-ui/core'; import { Save } from '@material-ui/icons'; import { useFormState } from 'react-final-form'; import React, { useCallback } from 'react'; const Toolbar = ({ onSubmit, translate }) => { const formState = useFormState(); const handleCustomSubmit = useCallback(() => { const data = formState.values; onSubmit(data); }, [formState.values]); return ( <Button id="SLM_saveButton" onClick={handleCustomSubmit}> <Save /> {translate('ui_update')} </Button> ); }; 这里是错误 useFormState must be used inside of a <Form> component 6 | 7 | const Toolbar = ({ onSubmit, translate }) => { > 8 | const formState = useFormState(); | ^ 9 | 10 | const handleCustomSubmit = useCallback(() => { 11 | const data = formState.values; at useForm (node_modules/react-final-form/dist/react-final-form.cjs.js:297:11) at useFormState (node_modules/react-final-form/dist/react-final-form.cjs.js:309:14) at Component (packages/ui/src/components/Toolbar/component.js:8:21) at wrappedComponent.displayName.adapter.displayNameOfNode.type (node_modules/enzyme-adapter-react-16/src/ReactSixteenAdapter.js:569:33) at ReactShallowRenderer.render (node_modules/react-test-renderer/cjs/react-test-renderer-shallow.development.js:858:32) at fn (node_modules/enzyme-adapter-react-16/src/ReactSixteenAdapter.js:645:55) at withSetStateAllowed (node_modules/enzyme-adapter-utils/src/Utils.js:99:18) at Object.render (node_modules/enzyme-adapter-react-16/src/ReactSixteenAdapter.js:645:20) at new ShallowWrapper (node_modules/enzyme/src/ShallowWrapper.js:411:22) at Object.shallow (node_modules/enzyme/src/shallow.js:10:10) 我不明白如何在<Form/>中正确使用useFormState和react-admin 我将react-admin v2.0升级到3.0,我遵循了本指南。我对react-final-form和笑话测试有疑问。我在按钮上执行了自定义逻辑,并且需要表单值,所以我使用...

问题描述 投票:0回答:1

我将react-admin v2.0升级到3.0,我遵循了此guide

reactjs jestjs redux-form react-admin react-final-form
1个回答
1
投票

您需要在测试中将<Form>放在<Toolbar/>周围。 useFormState()在React上下文中查找包含的表单。显然,在您的应用程序中,您的<Toolbar/>始终位于<Form/>内,因此您需要复制该代码以进行测试。

© www.soinside.com 2019 - 2024. All rights reserved.