我的 React 应用程序中有以下突变组件:
<Mutation
mutation={REF_REQUEST_MUTATION}
variables={{ fullname, email, relationship, position, message }}
>
{refRequestMutation => (
<Button onClick={refRequestMutation}>Send</Button>
)}
</Mutation>
该突变组件位于模态中,并且已成功发送突变。不过,我还需要 onClick 事件来关闭模式并发送突变。
我关闭模式的方法如下所示:
closeModal(modal) {
this.setState({
[modal]: false,
});
}
这是我添加到按钮以关闭模式的 onClick 事件
<Button onClick={this.closeModal.bind(this, "modal3")}> Close </Button>
我的主要问题是如何将第二个 onClick 事件添加到包含在突变组件中的按钮。我尝试过创建一个额外的方法来处理这两个事件,并且我尝试将另一个 onClick 事件添加到同一个按钮。
两者都不起作用。我对在 React 应用程序中使用 graphQL 还很陌生,所以我不确定如何更改突变的语法。
提前致谢!
最佳答案
创建一个处理两者的附加方法应该可行。技巧是将 refRequestMutation 回调传递一个参数给事件处理程序(我更喜欢从工厂函数创建和返回处理程序,但您也可以使用绑定(bind),就像您在其他地方所做的那样):
<Mutation
mutation={REF_REQUEST_MUTATION}
variables={{ fullname, email, relationship, position, message }}
>
{refRequestMutation => (
<Button onClick={this.handleMutation.bind(this, "modal3", refRequestMutation)}>Send</Button>
)}
</Mutation>
handleMutation (modal, mutationCallback, e) {
this.closeModal(modal);
mutationCallback(e);
}
关于javascript - 如何在 React 中的 GraphQL 突变组件中包含的按钮上有多个 onClick 事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54506229/