Блог

Главная - Вопросы по программированию - Как я могу передать переменную useQuery из компонента prop?

Как я могу передать переменную useQuery из компонента prop?

#javascript #reactjs #graphql #frontend #apollo

Вопрос:

У меня есть такой запрос :

 const GET_ANALYTICS = gql`
  query($courseId: String) {
    getStudentsAnalytics(courseId: $courseId) {
        totalStudents,
        studentsNotStartedCoursesYetPercentage,
        studentsFinishedCoursesPercentage,
        studentsInProgressCoursesPercentage,
        studentsCompletedQuizzesPercentage,
        studentsFailedQuizzesPercentage,
        studentsInProgressQuizzesPercentage
    }
}
`

и в коде я пытаюсь передать переменную из компонента prop:

 const AnalyticsStatistic = (courseId: string) => {

  const { loading, error, data } = useQuery(GET_ANALYTICS){
   variables: {courseId},
 }

для красного подчеркнутого параметра CourseID я получаю следующие ошибки: «CourseID» объявлен, но его значение никогда не считывается.ts(6133)
Дубликат идентификатора ‘CourseID’.ts(2300)

и для внутренней переменной: {CourseID} я получаю эти ошибки:Дубликат идентификатора «CourseID».ts(2300) Элемент привязки «CourseID» неявно имеет тип «любой». ts(7031)

для внутреннего курса

для внешнего курса

проблемы в консоли

Комментарии:

1. добавьте свой код запроса GET_ANALYTICS. и попробуйте courseId только, а не объект

2. Я опубликовал ответ, приняв запрос GET_ANALYTICS , если это решит вашу проблему, пожалуйста, отметьте его как ответ

3. сделайте courseId строку to, потому что запрос ожидает, что это будет только строка

4. если это сработало, пожалуйста, поднимите голос и отметьте его как ответ 🙂

5. Для этого мне нужна репутация, но я проверил, все ли решено

Ответ №1:

ваш GET_ANALYTICS запрос выглядит так, поэтому вам не нужно передавать идентификатор курса внутри объекта, проверьте код ниже

 const GET_ANALYTICS = gql`
  query($courseId: String) {
    getStudentsAnalytics(courseId: $courseId) {
        ....
    }
}
`

соответствующий крючок useQuery следует использовать следующим образом и вместо любого аргумента CourseID использовать строку, потому что запрос ожидает строку

 const AnalyticsStatistic = (courseId: string) => {
                                           //? FIX 
 const { loading, error, data } = useQuery(GET_ANALYTICS,{
  variables: {courseId},
})

если вы получаете неиспользуемую переменную, добавьте ее внутрь tsconfig.json 

 {
  "compilerOptions": {
    "noUnusedLocals": false,
    "noUnusedParameters": false
  }
}

Комментарии:

1. пока нет, я также добавил скриншоты для своей проблемы, не могли бы вы, пожалуйста, проверить их ?

2. Я обновил свой ответ, попробуйте установить эти флаги внутри tsconfig.json

3. установлено ли значение false? если это правда, измените ее на ложь

4. Я добавил: не могли бы вы , пожалуйста, проверить это ?

5. благослови тебя господь, приятель спасибо за внимание

Метки: