我的表单带有以下提交处理程序,然后使用react-apollo的mutate方法发送GraphQL突变:

const doSubmit = (values, { setSubmitting, setErrors }) => {
    //create a new obj: can't submit the extra stuff in values, GraphQL will yell at us!
    const newUser = {
        firstName: values.firstName,
        lastName: values.lastName,
        emailAddress: values.emailAddress,
        isActive: values.isActive,
        sharedAccount: values.sharedAccount,
        userId: values.userId
    };

    mutate({
        variables: { user: newUser },
        update: store => {
            //only update if adding a new user
            if (values.userId !== 0) {
                return;
            }
            let data = store.readQuery({ query: USER_LIST_QUERY });
            data.users.push(newUser);
            store.writeQuery({ query: USER_LIST_QUERY, data });
        }
    }).then(() => {
        //let formik know that submit is complete
        setSubmitting(false);
        //todo: redirect to userlist
    });
};


此方法基于this mutate-with-update example in the docs

我知道mutate承诺处理程序将有权访问插入的ID,因为它将在graphql响应中返回,但这似乎不及时。

除非我也可以从该Promise处理程序访问store,否则我不知道这怎么可能。但是似乎必须要有一种方法,对吧?我是否缺少明显的东西?

最佳答案

update方法提供了更新的对象作为第二个参数

update: (store, { ... access userId here ... }) => { ... }


docs


  在突变的整个生命周期中,该函数将被调用两次。从一开始就提供了optimisticResponse。从乐观数据创建的写入将在第二次调用此函数之前回滚,这是突变成功解决的时间。届时将使用实际的突变结果调用更新,并且不会回退那些写入。

07-28 02:27
查看更多