Query Variables

What is a variable in GraphQL context?

GraphQL has a first-class way to factor dynamic values out of the query, and pass them as a separate dictionary. These values are called variables. In our case, we are defining the object to be inserted as a mutation.

So let's define the graphql mutation to be used.

Open src/components/Todo/TodoInput.svelte and add the following code:

githubsrc/components/Todo/TodoInput.svelte
<script>
+ import { gql } from "@apollo/client";
+ const ADD_TODO = gql `
+ mutation ($todo: String!, $isPublic: Boolean!) {
+ insert_todos(objects: {title: $todo, is_public: $isPublic}) {
+ affected_rows
+ returning {
+ id
+ title
+ created_at
+ is_completed
+ }
+ }
+ }
+ `;
</script>
<form class="formInput" on:submit|preventDefault={addTodo}>
<input
class="input"
placeholder="What needs to be done?"
/>
<i class="inputMarker fa fa-angle-right" />
</form>

What does this mutation do?

The mutation inserts into todos table with the $objects variable being passed as one todo type.

Awesome! We have defined our first graphql mutation.

Close

Get Started with GraphQL Now

Hasura Cloud gives you a fully managed, production ready GraphQL API as a service to help you build modern apps faster.
Ready to get started?
Start for free on Hasura Cloud or you could contact our sales team for a detailed walk-through on how Hasura may benefit your business.
Stay in the know
Sign up for full access to our community highlights, new features, and occasional baby animal gifs! Oh, and we have a strict no-spam rule. โœŒ๏ธ