I am getting an error in my to react native project when pulling data from my sanity backend
this is the error
URLSearchParams.set is not implemented
This is where I am fetching he data
import {View, Text,SafeAreaView,Image,TextInput,ScrollView} from 'react-native'
import React, {useEffect, useLayoutEffect, useState} from 'react'
import {useNavigation} from "@react-navigation/native";
import {ChevronDownIcon, UserIcon,AdjustmentsVerticalIcon,MagnifyingGlassIcon} from "react-native-heroicons/outline";
import Categories from "../components/Categories";
import FeaturedRow from "../components/FeaturedRow";
import client from "../sanity";
const HomeScreen = () => {
const navigation = useNavigation();
const [featuredItems, setFeaturedItems] = useState([]);
useLayoutEffect(()=>{
navigation.setOptions({
headerShown: false,
});
},[]);
useEffect(()=>{
const query = `*[_type == "featured"]`;
client
.fetch(query)
.then((data)=>{
setFeaturedItems(data)
})
.catch((error)=>{
console.log('Error:',error);
});
}, []);
This is my Sanity.js code as well
import sanityClient, {createClient} from '@sanity/client'
import imageURLBuilder from '@sanity/image-url'
// import urlForImage from "@sanity/image-url/lib/types/urlForImage";
const client = sanityClient({
projectId: "9hrg98uk",
dataset: "production",
useCdn: true,
apiVersion: "2021-10-21",
});
const builder = imageURLBuilder(client);
export const urlFor = (source) => builder.image(source);
export default client;
This error only occurs when rendering on ios as i don’t see the error on the web
I have tried to fetch my data differently, that didn’t work. I have tried importing URLsearch into my project even though i have not used URLSearch anywhere but thatdid not work also.
2
Answers
The thing is there is a URL class in React Native but not all feature are implemented which you might encounter a is not implemented error such as URLSearchParams.set is not implemented, URL.hostname is not implemented, etc.
Instead you can use
try importing this in you index.js file
It will create a polyfill for URLSearchParams
Please refer to this doc
The thing is there is a URL class in React Native but not all feature are implemented which you might encounter a is not implemented error such as URLSearchParams.set is not implemented, URL.hostname is not implemented, etc.
Instead you can use
npm install react-native-url-polyfill –save-dev
try importing this in you index.js file
import ‘react-native-url-polyfill/auto’;
It will create a polyfill for URLSearchParams
This answer is correct!! Thank you!!