Question

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

components / 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;

components / 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>

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

Answer 1

将null作为关键字传递而没有引号，因为connect API检查对象。在传递字符串时，API实现中存在的类型验证引发了错误：

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

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

1 个答案: