我刚开始使用martyjs
,我面临的问题是我无法从 marty 组件容器中渲染 React 组件。Store 似乎可以工作,但martyjs
Store 更改后组件容器不会更改。我需要一些关于应该写什么console.log
来使这段代码工作的指导。
这是我当前的代码:
var CardStore = Marty.createStore({
id: "CardStore",
handlers: {
change: AppConstants.CARD_CHANGE,
ratingReceive: AppConstants.RATING_RECEIVE
},
getInitialState: function () {
return { pid: '', card:{pid:''}};
},
get: function(){
console.log('GET', this.state);
return this.state;
},
change: function (pid) {
console.log("STORE FETCH- WORKED", pid);
this.state.pid = pid;
return this.fetch({
id: pid,
remotely: function () {
return RatingHttpAPI.get(pid);
}
});
},
ratingReceive: function (rating) {
.....
this.hasChanged();
console.log("STORE CHANGES - WORKED", rating.pid);
}
});
var RatingHttpAPI = Marty.createStateSource({
type: "http",
id: "RatingHttpAPI",
get: function (pid) {
console.log("API GET", pid);
return this.post({url: res.url.rating.list, body: Model.addAntiForgery({pid: pid})})
.then(function (response) {
console.log("API RECEIVE -WORKED", pid);
CardActionCreators.ratingReceive(response.body);
});
},
});
var CardActionCreators = Marty.createActionCreators({
id: "CardActionCreators",
change: function (pid) {
this.dispatch(AppConstants.CARD_CHANGE, pid);
},
ratingReceive: function(rating){
this.dispatch(AppConstants.RATING_RECEIVE, rating);
}
});
var Row2RightCol = React.createClass({
render: function () {
var props = this.props;
console.log("RENDER-FIRED ONCE ON LOAD",props);
return (
<div>
<p>{props.pid}</p>
</div>
);
}
});
Marty.createContainer(Row2RightCol, {
listenTo: CardStore,
fetch() {
console.log("CONTAINER FETCH-NOT FIRED");
return {
card: CardStore.for(this).get()
}
}
});
$(document).ready(function () {
React.render(<Row2RightCol/>, $("#card .row:eq(1) .col-right")[0]);
});
在此需要对此问题进行一些澄清。