Reactjs 中继中发生突变后，使用查看器更新子组件

我是中继新手（使用reactjs），在查看器中发生提交变异后，在更新UI时遇到问题。在我的示例中，我有一个带有用户名的称呼组件，为了简化这个过程，我在用户名的输出后面放了一个输入字段

当用户更改textfield中的名称时，我会将其发送到UpdateStation和API。我的问题是，在保存新名称后，我不知道如何更新输入上方的名称。有人能帮我吗？我需要在更新程序中做什么

非常感谢

根组件：

import React, {Component} from 'react';
import {QueryRenderer, graphql} from 'react-relay';
import environment from 'app/settings/createRelayEnvironment';
import Salutation from 'app/components/dashboard/includes/Salutation';


const DashboardQuery = graphql`
    query DashboardQuery {
        viewer {
            ...Salutation_viewer
        }
    }
`;

class Dashboard extends Component {
    render() {
        return (
            <QueryRenderer
                environment={environment}
                query={DashboardQuery}
                render={({error, props}) => {
                    if (error) {
                        return <div>{error.message}</div>;
                    } else if (props) {
                        return (
                            <div>
                                <Salutation viewer={props.viewer}></Salutation>
                            </div>
                        );
                    }

                    return <div>Loading</div>;
                }}
            />
        );
    }
}

export default Dashboard;

import React, {Component} from 'react';
import {createFragmentContainer, graphql} from 'react-relay';
import PropTypes from 'prop-types';
import UpdateDashboardMutation from 'app/mutations/UpdateDashboardMutation';


class Salutation extends Component {
    render() {
        return (
            <div className="salutation">
                <h2>Willkommen {this.props.viewer.firstName}</h2>
                <input type="text" onChange={this._onChange.bind(this)}/>
            </div>
        );
    }

    _onChange(event) {
        UpdateDashboardMutation(event.currentTarget.value);
    }
}

Salutation.propTypes = {
    viewer: PropTypes.object
};

export default createFragmentContainer(Salutation, graphql`
    fragment Salutation_viewer on Viewer {
        firstName
    }
`);

import {commitMutation, graphql} from 'react-relay';
import environment from 'app/settings/createRelayEnvironment';


const mutation = graphql`
    mutation UpdateDashboardMutation($input: UpdateDashboardMutationInput!) {
        updateDashboard(input: $input) {
            ok,
            errors {
                field,
                messages
            }
        }
    }
`;


function UpdateDashboardMutation(firstName) {
    commitMutation(
        environment,
        {
            mutation,
            variables: {
                input: {
                    firstName
                }
            },
            updater(store) {
                // what i have to do here?
            }
        }
    );
}

export default UpdateDashboardMutation;

尝试：

---

有关详细信息，请参阅。

它不起作用：（在控制台中，我收到以下错误：

未捕获错误：RelayRecordSourceSelectorProxy#getRootField（）：找不到根字段“viewer”，在GraphQL文档“UpdateDashBoard”中未定义此类字段。

我找到了解决方案。我将viewerId传递给UpdateStation，并使用它获取查看器：

const viewer=store.get（viewerId）；

现在它可以工作了。非常感谢：）

const viewer = store.getRootField('viewer');
viewer.setValue(firstName, 'name');