ReactJS: एक राज्य के आधार पर गतिशील रूप से GraphQL क्वेरी आयात करें

आप कस्टम हुक का उपयोग करके इसे अधिक मॉड्यूलर लेकिन फिर भी गतिशील बना सकते हैं, उदाहरण के लिए:

// hooks/useItemsQuery.js
function useItemsQuery(locale) {
  const itemsQuery = useMemo(() => gql`
    query getItems($id: String!) {
      Items(id: $id) {
        id
        notes
        nameTranslate(language:"${locale}")
        defaultClass {
        nameTranslate(language:"${locale}")
        }
      }
    }
  `, [locale])

  return itemsQuery
}

// App.js
export const App = () => {
  const { locale } = useIntl()

  const itemsQuery = useItemsQuery(locale)
  
  useEffect(() => {
    // a function to fetch itemsQuery
  }, [itemsQuery])
}

या यदि आपको रिएक्ट के बाहर कॉल करने की आवश्यकता है तो बस एक सामान्य कार्य करेगा। मैं सोचता हूं इसका कोई पूर्ण प्रभाव नहीं होगा क्योंकि es6 tpl अक्षर कैश किए जाते हैं (gql`` भाग) जब तक कि किसी फ़ंक्शन के अंदर भी चर नहीं बदलते हैं। अगर ऐसा है तो ऊपर दिए गए useMemo का उपयोग वैसे भी बेमानी है।

function itemsQuery(locale) {
  return gql`
    query getItems($id: String!) {
      Items(id: $id) {
        id
        notes
        nameTranslate(language:"${locale}")
        defaultClass {
        nameTranslate(language:"${locale}")
        }
      }
    }
  `
}