我刚刚开始使用martyjs
,我面临的问题是我无法从marty组件容器中呈现React组件。商店似乎有效,但商店更改后martyjs
组件容器不会更改。我需要一些关于应该在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]);
});
在这个问题上需要澄清一下。
答案 0 :(得分:0)
Haven没有使用Marty,但是Marty.createContainer()
返回一个新的React组件,它包装了你的Row2RightCol
组件并添加了绑定。您应保存Marty.createContainer()
的返回值并使用该值而不是直接使用Row2RightCol
。
答案 1 :(得分:0)
检查Flux比较报告https://github.com/voronianski/flux-comparison它有Marty.js示例。