ReactJs 0.14 – 不变违规:对象作为React子对象无效
我正在使用react-hot-loader.当我进行更改并重新加载页面时,我没有收到任何错误.但是,当我手动刷新页面时,我收到上面标题中的错误. 简单的JSON数据: const companyBlog = [ { blogTitle: "Company Blog",blogLinkTo: "companyBlog",blogTagLine: 'If you have any questions,contact us',blogPosts: [ { createDate: "2015-02-10T10:50:42.389Z",linkTo: "blogPost1Link",title: "This is the title to Blog Post 1",content: "<p>This is the content to Blog Post 1</p>",author: "John Smith",categories: [1,3] },{ createDate: "2015-07-05T10:50:42.389Z",linkTo: "blogPost2Link",title: "This is the title to Blog Post 2",content: "<p>This is the content to Blog Post 2</p>",author: "Jane Doe",categories: [2,{ createDate: "2015-04-22T10:50:42.389Z",linkTo: "blogPost3Link",title: "This is the title to Blog Post 3",content: "<p>This is the content to Blog Post 3</p>",4] } ] } ]; 获取博客数据: getcompanyBlog() { let results = []; this.setState({ blogTitle: companyBlog[0].blogTitle,blogLinkTo: companyBlog[0].blogLinkTo,blogTagLine: companyBlog[0].blogTagLine }); companyBlog[0].blogPosts.map(function (post,index) { let dateArry = new Date(post.createDate).toString().split(' '); return( results.push( <li key= { index }> <time dateTime={ post.createDate }> <span>{ dateArry[1]}</span> <strong>{ dateArry[2] }</strong> </time> <Link to='test'>{ post.title }</Link> </li> ) ) }.bind(this)) this.setState({blogPosts: results}); } 渲染结果: render() { return ( <div> { this.state.blogPosts } </div> ) } 更新:这是我的构造函数: constructor(props) { super(props); this.state = { blogTitle: '',blogLinkTo: '',blogTagLine: '',blogPosts: [{ createDate: '',linkTo: '',title: '',content: '',author: '',categories: [] } ] } } 我在导航菜单及其子菜单项中使用了这种相同的方法,并且没有收到任何错误.
并且错误消息: 未捕获错误:不变违规:对象无效作为React子对象(找到:具有键{createDate,linkTo,title,content,author,categories}的对象).如果您要渲染子集合,请使用数组,或使用React附加组件中的createFragment(object)包装对象.检查BlogSideBar的render方法. 我不知道这个错误告诉我什么或如何纠正.
在我开始处理这个博客之前,我先阅读了React的人们如何强烈反对使用ComponentWillMount而不是使用ComponentDidMount. 在这个博客示例中,与我提到的导航不同,我使用…. componentDidMount() { this.getcompanyBlog() } 并且问题开始发生.但是,当我把它改为…… componentWillMount() { this.getcompanyBlog() } 问题消失了. 那React大师呢?我可以不使用componentWillMount吗? (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |