Soy nuevo en RTK Query y uso Redux ToolKit Query para obtener los datos. Pregunta : ¿Cómo cambio dinámicamente la baseUrl en createApi desde el campo de entrada en el archivo App.js?
Vi una pregunta similar aquí, pero las soluciones que se proporcionaron no funcionan en mi caso. ¿Cómo cambiar dinámicamente la URL base usando redux-toolkit?
export const WebApi = createApi({ reducerPath: 'API', baseQuery: fetchBaseQuery({ baseUrl: 'http://localhost:3001/api' }), endpoints: () => ({}), });Cómo hacer una llamada API desde el archivo App.js, donde el usuario puede poner cualquier tipo de enlace API en el campo de entrada y obtener el resultado.
algo como esto:
const dynamicUrl = '' <button className="btn" type="button" onClick={() => refetch(dynamicUrl)}>Fetch Data</button>Si pasa una URL completa (starting with http:// or https://) , fetchBaseQuery omitirá baseUrl y utilizará la URL proporcionada en su lugar. Por lo tanto, puede usar la lógica que vinculó anteriormente para simplemente anteponer su baseUrl actual a la url de la consulta.
Simplemente puede poner "https://" en su baseUrl y para los puntos finales puede pasar una cadena que será su URL dinámica. Puede hacer esto
export const WebApi = createApi({ reducerPath: 'API', baseQuery: fetchBaseQuery({ baseUrl: "https:", }), endpoints: (builder) => ({ getUsers: builder.query({ query: (name) => `/${name}`, }), }), });export const { useGetUsersQuery } = usersApi;
En su App.js puede simplemente pasar el valor
const { data, isLoading, refetch } = useGetUsersQuery('//randomuser.me/api');Espero eso ayude