时间戳

首页 > 解决方案 > 错误：连接组件 ConnectedForm 时 mapStateToProps 参数的类型字符串值无效

reactjs - 错误：连接组件 ConnectedForm 时 mapStateToProps 参数的类型字符串值无效

问题描述

我正在添加文章，以下是表格

组件/form.js

                import React ,{ Component } from 'react';
            import {connect} from 'react-redux';
            import uuidvl from 'uuid';
            import { addArticle } from '../actions/index';
            const mapDispatchtoProps= dispatch=>{
                return{
                    addArticle:article =>dispatch(addArticle(article))
                };
            };
            class ConnectedForm extends Component{
                constructor(){
                    super();
                    this.state={
                        title:''
                    }
                }
                handleChange(eVal,nm){
                    this.setState({[eVal.target.id]:eVal.target.value})
                }                    
                handleSubmit(ev){
                    ev.preventDefault();
                    const { title }=this.state;
                    const id = uuidvl();
                    this.props.addArticle({ title , id });
                    this.setState({title:''});
                }                    
                render(){
                    const {title}=this.state;
                    return(
                        <div>
                            <form onSubmit={this.handleSubmit.bind(this)}>
                                <input type='text' value={title} id="title" onChange={(e)=>this.handleChange(e.target.value,'article')}/>
                                <button type="submit">Add</button>
                            </form>
                        </div>
                    );
                }
            }
            const Form =connect('null',mapDispatchtoProps)(ConnectedForm);//**1**
            export default Form;

组件/list.js

            import React from 'react';
            import { connect } from 'react-redux';
            const mapStateToProps=  state =>{
                return { articles :state.articles};
            }
            const connectedList = ({ articles }) =>(
                articles.map(e=>(
                    <li key={e.id}>{e.title}</li>
                ))
            );
            const List= connect(mapStateToProps)(connectedList);////**2**
            export default List;

我收到此错误

错误：连接组件 ConnectedForm 时，mapStateToProps 参数的类型字符串值无效。

src/index.js

   <Provider store={store}>
    <Router>
        <Switch>
            <Route exact path="/" component={App}/>
            <Route path="/components/Form" component={Form}/>
        </Switch>
    </Router>
  </Provider>

任何人都可以请让我知道我要去哪里错了吗？

标签： reactjsreduxreact-redux

解决方案

作为不带引号的关键字传递null，因为connectAPI 检查对象。当您传递字符串时，API 实现中存在的类型验证会引发错误：

const Form =connect(null,mapDispatchtoProps)(ConnectedForm);

推荐阅读