Question

我正在尝试更新页面组件中的状态数据，回调正在触发，正确的数据将进入每个页面，但编辑后的值未显示在我的表组件中，它显示在可编辑的输入中但是不是在我的表格单元格中，而是显示编辑之前的值。

有人可以帮我在页面显示中获取新值吗？

我正在使用标签页从页面切换，每个页面组件都安装在主编辑页面上，如下所示：

 switch(name) {
        case "PageName":
            return <ExamplePageComponent
                    Id={this.state.id} 
                    sectionData={this.state.studentData.sectionData} />;

每个PageComponent可编辑表都有传递给它的更新方法：

var ExamplePageComponent= React.createClass({

onTableUpdate: function(data){
    var resultData = {};
    resultData.studentId = this.props.studentId;
    resultData.sectionId = 11; // section id (listed at parent node (EditStudentPage))
    resultData.elementId = data.elementId;
    resultData.actionType = data.type;
    resultData.data = data;
    resultData.updatedElements = data.updatedElements;
    StudentDataActions.updateStudentData(resultData);
},

render: function() {
    return (
        <Table {...tableOptions} tableData={this.props.sectionData} />
    );
}
});

在每个标签上，选择我调用此方法来更新每个标签页的内容：

handleTabSelect: function(key) {
    this.setState({activeTabId: key});
    StudentDataActions.updateEditStudentPageState(this.state.studentId,key);
},

标签组件：

<Tabs activeKey={this.state.activeTabId}  onSelect={this.handleTabSelect}>
                    {this.state.sections.map(function(section,i){
                        return (
                            <Tab
                                eventKey={section.value}
                                title={section.label}
                                key={i}
                                tabClassName="tabs__item"
                            >
                                {this.getElementByKey(section.name)}
                            </Tab>
                        );
                    }, this)}
                </Tabs>

handleTabSelect引用此操作：

   updateEditStudentPageState: function(studentID, dataSectionID) {
    this.studentData.dataSectionID = dataSectionID;
    switch(filtersData.dataSectionID){
         case 1:
            Service.loadMethod(filtersData, this.setLoadedState);
//etc

在每个页面组件更新中，我调用此动作/存储方法，saveMethod在回调中具有正确的数据。

updateStudentData: function(addUpdateData) {
    switch(this.data.dataSectionID){
        case 1:
            var callback = function(){
                StudentDataActions.updateEditStudentPageState(rowDataToSave.studentId, 1)
            }.bind(this);
            Service.saveMethod(rowDataToSave, callback);
            break;
        case 2// etc

我对上述方法的回调是：

setLoadedState: function(data) {

    this.studentData.activeData.sectionName = data;
    this.trigger(this.studentData);
},

我的行动是：

var ApplicationActions = Reflux.createActions([
'routeChange',
'getPageData',
'setLoadedState',
'updatePageDataFilters'
]);

我以此为例，https://ochronus.com/react-reflux-example/

组件状态不从触发器更新

0 个答案: