小编emc*_*ell的帖子

无法让 MemoryRouter 与 @testing-library/react 一起工作

我正在尝试测试我的路由器是否按预期工作。但我无法让路由器指向另一个位置/

这是我的简化测试代码。

App.tsx

import React from 'react';
import {Route, Switch, BrowserRouter} from 'react-router-dom';

const App: React.FC = () => {
    return (
        <div>
            <BrowserRouter>
                <Switch>
                    <Route path={'/test'}>test</Route>
                    <Route path={'/'}>index</Route>
                </Switch>
            </BrowserRouter>
        </div>
    );
};

export default App;
Run Code Online (Sandbox Code Playgroud)

App.test.tsx

import React from 'react';
import App from './App';
import {MemoryRouter} from 'react-router-dom';
import {render} from '@testing-library/react';


test('renders /test route', async () => {
    const app = render(
        <MemoryRouter initialEntries={['/test']} initialIndex={0}>
            <App/>
        </MemoryRouter>);
    expect(app.getByText(/test/i)).toBeInTheDocument();
});

Run Code Online (Sandbox Code Playgroud)

我收到以下错误消息

Error: Unable to find an element …
Run Code Online (Sandbox Code Playgroud)

reactjs react-router react-testing-library

11
推荐指数
1
解决办法
2410
查看次数

react-hook-form reset 不适用于 Controller + antd

我正在尝试将 react-hook-form 与 antd<Input />组件一起使用

我不能reset一起工作<Controller />

这是我的代码:

const  NormalLoginForm = () =>{
  const {reset, handleSubmit, control} = useForm();

  const onSubmit = handleSubmit(async ({username, password}) => {
        console.log(username, password);
        reset();
  });

    return (
      <form onSubmit={onSubmit} className="login-form">
        <Form.Item>
                        <Controller as={<Input
                            prefix={<Icon type="user" style={{color: 'rgba(0,0,0,.25)'}}/>}
                            autoFocus={true}
                            placeholder="Benutzername"

                        />} name={'username'} control={control}/>

                    </Form.Item>
                    <Form.Item>
                        <Controller as={<Input
                            prefix={<Icon type="lock" style={{color: 'rgba(0,0,0,.25)'}}/>}
                            type="password"
                            placeholder="Passwort"

                        />} name={'password'} control={control}/>
                    </Form.Item>
        <Form.Item>
          <Button type="primary" htmlType="submit" className="login-form-button">
            Log in
          </Button>
        </Form.Item>
      </form>
    );
}
Run Code Online (Sandbox Code Playgroud)

我期望在提交表单时清除两个输入字段。但这不起作用。 …

reactjs antd react-hook-form

10
推荐指数
1
解决办法
8333
查看次数