todoの更新 - mutation

ここでは、GraphQL Mutationsを使って既存のtodoの完了をマークする方法を学びます。

todosでmutationを行うためのgraphql queryを定義します。

Copy
  mutation toggleTodo ($id: Int!, $isCompleted: Boolean!) {
    update_todos(where: {id: {_eq: $id}}, _set: {is_completed: $isCompleted}) {
      affected_rows
    }
  }

また、variablesに値を渡す必要もあります。

アプリケーションデータベースに対してGraphiQLでこのmutationを試して、どのような応答が得られるかを確認します。

それでは、このgraphql mutationをReactアプリに組み込みましょう。