[英]Unable to set properties using react-redux
I'm trying to get the following code to work where I am using both react and redux. 我正在尝试使以下代码在我同时使用react和redux的地方工作。 The problem is that
this.props.comments
is undefined, what am I doing wrong? 问题是
this.props.comments
未定义,我在做什么错?
reducer.js: reducer.js:
import {Map,List} from 'immutable';
const initialState = Map({comments:List()});
export default function(state = initialState, action) {
switch (action.type) {
case 'ADD_COMMENT':
return state.update('comments', comments => comments.push(action.comment));
default: return state;
}
}
index.js index.js
import React from 'react';
import ReactDOM from 'react-dom';
import CommentBoxContainer from './components/CommentBox';
import {Provider} from 'react-redux';
import {createStore} from 'redux';
import reducer from './reducer'
const store = createStore(reducer);
store.dispatch({
type: 'ADD_COMMENT',
comment:
{id: 3, author: "Me", text: "This is one comment!"}
});
ReactDOM.render(
<Provider store={store}>
<CommentBoxContainer />
</Provider>,
document.getElementById('root')
);
CommentBox.js CommentBox.js
import React from 'react';
import { connect } from 'react-redux';
const CommentBox = React.createClass({
render: function() {
return (
<div className="commentBox">
<h1>Comments</h1>
<CommentList comments={this.props.comments}/>
<CommentForm />
</div>
);
}
});
function mapStateToProps(state) {
return { comments: state.comments };
}
const CommentBoxContainer = connect(mapStateToProps)(CommentBox);
export default CommentBoxContainer;
var CommentList = React.createClass({
render: function() {
var commentNodes = this.props.comments.map(function(comment) {
return (
<Comment author={comment.author} key={comment.id}>
{comment.text}
</Comment>
);
});
return (
<div className="commentList">
{commentNodes}
</div>
);
}
});
const CommentForm = React.createClass({
render: function() {
return (
<div className="commentForm">
</div>
);
}
});
const Comment = React.createClass({
render: function() {
return (
<div className="comment">
<h2 className="commentAuthor">
{this.props.author}
</h2>
{this.props.children}
</div>
);
}
});
state
is Map
from immutable.js
. state
是来自immutable.js
Map
。 So in mapStateToProps
, state.comments
is undefined
but state.get('comments')
should not be. 因此,在
mapStateToProps
, state.comments
是undefined
但state.get('comments')
应该不是。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.