0

作業を始めたばかりでmartyjs、直面している問題は、マーティ コンポーネント コンテナーから 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]);
});

この問題についてここでいくつかの説明が必要です。

4

2 に答える 2

0

Flux 比較リポジトリhttps://github.com/voronianski/flux-comparisonを確認してください。Marty.js の例があります。

于 2015-04-17T18:59:22.813 に答える