警告:无法为无状态功能组件提供参考。试图访问此引用将在reactjs

时间:2018-03-16 08:42:53

标签: react-redux

我正在尝试将react-redux-form与react-bootstrap集成。

这是我的代码

import React from 'react';
import { Control,Form,actions,Errors } from 'react-redux-form';
import { connect } from 'react-redux';
import * as ReactBootstrap from 'react-bootstrap';
class UserRegistration extends React.Component {

    render() {
        const { dispatch } = this.props;
        const required = (val) => val && val.length;
        const ReduxFormControl = ({input, meta, ...props}) => {
            return <ReactBootstrap.FormControl {...props} {...input} />
        };

        const Forms = ({input, meta, ...props}) => {
            return <ReactBootstrap.Form {...props} {...input} />
        };
        return (
            <Form model="userReg" onSubmit={(userReg) => dispatch(actions.load("userReg",userReg))}  component={Forms} >
                <label >fname</label>
                <Control.text model="userReg.fname" validators={{required}} placeholder="Name" component={ReduxFormControl}  />
                <Errors model="userReg.fname" messages={{required:'required'}} />
                <label>lame</label>
            <Control.text model="userReg.lname" validators={{required}} placeholder="lame" component={ReduxFormControl}  />
                <button type="submit">register</button>              
            </Form >
        )
    }
}
export default connect (null)(UserRegistration); 

当我将表单组件传递给redux表单标记时,它显示以下错误。

index.js:2178 Warning: Stateless function components cannot be given refs. Attempts to access this ref will fail.

Check the render method of `Form`.
    in Forms (created by Form)
    in Form (created by Connect(Form))
    in Connect(Form) (at registration.js:18)
    in UserRegistration (created by Connect(UserRegistration))
    in Connect(UserRegistration) (created by Route)
    in Route (at routes.js:14)
    in div (at routes.js:10)
    in Router (created by BrowserRouter)
    in BrowserRouter (at routes.js:9)
    in routes (at index.js:13)
    in Provider (at index.js:12)

有人可以帮助我解决这个警告,还有其他更好的方法来整合react -bootstrap和react-redux-form吗?

0 个答案:

没有答案