Блог

Главная - Вопросы по программированию - как вызвать условный хук запроса в react / apollo

как вызвать условный хук запроса в react / apollo

#reactjs #asynchronous #react-hooks #react-apollo #apollo-client

#reactjs #асинхронный #реагирующие перехваты #react-apollo #apollo-клиент

Вопрос:

Итак, я знаю, что могу использовать skip запрос on, чтобы пропустить их, но для этого мне нужно сделать что-то вроде этого

 const [fetchQuery1, { loading1, data1 }] = useQuery({
 //..
 skip: cond1
});
const [fetchQuery2, { loading2, data2 }] = useQuery({
 //..
 skip: cond2
});
const [fetchQuery3, { loading3, data3 }] = useQuery({
 //..
 skip: cond3
});

но это большая переменная для некоторых неиспользуемых запросов

У меня есть код, в котором в основном есть 3 запроса, и только один будет запущен из трех. Вместо создания переменной millions, чем add a if(loading1 || loading2 || loading3) , я хотел бы иметь единственную переменную загрузки.

итак, прямо сейчас я делал

   const { data, loading, error } = cond1
    ? useQuery(Query1)
    : cond2 ? useQuery(Query2) : useQuery(Query3)

итак, вышесказанное работает, но это противоречит правилу условных хуков.

Итак, мне интересно, есть ли хороший способ сделать это, не загрязняя переменные

Ответ №1:

Вы могли бы условно передать документ gql в хук useQuery.

 const QUERY = cond1 ? QUERY1 : cond2 ? QUERY2 : QUERY3;
const { data, loading, error } = useQuery(QUERY);

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

1. привет, спасибо, это действительно сработало бы. Но моя ошибка в том, что я также использую типизацию, useQuery<T,D>() поэтому, я думаю, мне следует использовать там несколько типов ввода.

2. Да, вы могли бы использовать объединения для ввода хука, но это будет не так безопасно, как просто иметь только один хук и один ввод.