GraphQL - использование переменных в запросе на apollo - PullRequest
Новая
       32

GraphQL - использование переменных в запросе на apollo

0 голосов
/ 08 февраля 2020

Я использую apollo и graphql в проекте Nuxt и хочу выполнить запрос по уникальному свойству, но не могу определить запрос для него, не сделав его слегка глючным.

Так что это текущая работа запрос по идентификатору: 

query Category($id: ID!) {
  category(id: $id) {
    name
    designs {
      id
      project_name
      images {
        url
      }
    }
  }
}

Использование этой настройки в Nuxt: 

...

data() {
  return {
    category: []
  }
},


apollo: {
  design: {
    prefetch: true,
    query: designQuery,
    variables() {
      return { id: this.$route.params.id }
    }
    }
}

...

Я хочу использовать имя, чтобы получить его, так как имя должно быть уникальным полем в mongoDB. И это самое близкое, что я получил к рабочей версии. Единственная проблема заключается в том, что я получаю его в виде массива, и Nuxt действительно шатается, когда переключается между разными именами _name. vue, используя ссылки на маршрутизаторы. 

query Category($name: String) {
  categories(where: { name: $name }) {
    name
    designs {
      id
      project_name
      images {
        url
      }
    }
  }
}

Это сработало (настройки apollo были изменены, чтобы соответствовать) , так как он вернул массив категорий, соответствующих именам. Но всякий раз, когда я переходил от categories/foo к categories/bar. Nuxt не хотел ничего этого. Что-то столь же простое, как чтение, заблокированное несколькими v-if, говорило мне, что оно не может читать неопределенное из category[0].name. Что не имеет смысла для меня, так как первая загруженная страница работает нормально и загружается правильно. 

...

<div v-if="category[0] !== undefined && category[0] !== null">
  <h1 v-if="category[0].name !== undefined">{{ category[0].name }}</h1>
  <Designs :designs="category[0].designs || []"></Designs>
</div>

...
...