6 C
London
Friday, April 26, 2024

ios – Expo,React Native Error: Invariant Violation: “most important” has not been registered, ReferenceError: Property ‘consumer’ would not exist, js engine: hermes


I am utilizing on React Native and Expo go.
This error instantly occurred whereas working as normal with React Native.
I do not bear in mind precisely what step it was, but it surely appears to have began to happen after I created a hook referred to as useProductFetch for useState variables or features declared inside a practical part.
To resolve this downside, I created a brand new challenge folder, moved the information, and reinstalled the dependencies. However I have been getting this error repeatedly, and I have been in search of a technique to repair this for about two days. And to unravel the error “Invariant Violation: “most important” has not been registered”, i checked my “identify” in app.json and package deal.json. there weren’t any issues.
Right here is my codes.

{
  "identify": "frontend",
  "model": "1.0.0",
  "most important": "node_modules/expo/AppEntry.js",
  "scripts": {
    "begin": "expo begin",
    "android": "expo begin --android",
    "ios": "expo begin --ios",
    "net": "expo begin --web"
  },
  "dependencies": {
    "@expo/vector-icons": "^14.0.0",
    "@react-native-async-storage/async-storage": "1.21.0",
    "@react-navigation/bottom-tabs": "^6.5.20",
    "@react-navigation/native": "^6.1.17",
    "@react-navigation/native-stack": "^6.9.26",
    "@reduxjs/toolkit": "^2.2.3",
    "axios": "^1.6.8",
    "expo": "~50.0.14",
    "expo-checkbox": "~2.7.0",
    "expo-image-picker": "~14.7.1",
    "expo-linear-gradient": "~12.7.2",
    "expo-location": "~16.5.5",
    "expo-media-library": "~15.9.2",
    "expo-radio-button": "^1.0.8",
    "expo-status-bar": "~1.11.1",
    "react": "18.2.0",
    "react-native": "0.73.6",
    "react-native-gesture-handler": "~2.14.0",
    "react-native-modal": "^13.0.1",
    "react-native-reanimated": "~3.6.2",
    "react-redux": "^9.1.1"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0"
  },
  "personal": true
}

That is the half the place a customized hook was used within the aforementioned part.


import { useProductFetch } from './useProductFetch';
import { primary_gray } from '../../types/frequent/colours';
import { TouchMenu } from './touch_menu';
import { CreateReview } from './CreateReview';
import { AntDesign } from '@expo/vector-icons';

export const ProductDetail = () => {
  const {
    currentPage,
    currentProduct,
    handleHeart,
    handleHorizontalScroll,
    coronary heart,
    isUsers,
    token,
    consumer,
    borderWidths,
    handlePress,
    activeMenu,
    navigation,
  } = useProductFetch();
//...
...//
}

And the customized hook code:

export const useProductFetch = () => {
    const [heart, setHeart] = useState({});
    const { selectedProductId, currentProduct } = useSelector((state) => state.merchandise);
    const [isUsers, setIsUsers] = useState(false);
    const dispatch = useDispatch();
    const navigation = useNavigation();
    const { consumer, token } = useSelector((state) => state.userAuth);
    const [currentPage, setCurrentPage] = useState(0);
    const [activeMenu, setActiveMenu] = useState(0);
    const borderWidths = [...Array(3)].map(() => useSharedValue(0));
    const { width } = Dimensions.get('window');
    const handleHorizontalScroll = (occasion) => {
    const contentOffsetX = occasion.nativeEvent.contentOffset.x;
    const currentPageIndex = Math.spherical(contentOffsetX / width);
    setCurrentPage(currentPageIndex);
  };

    const fetchDetail = useCallback(() => {
       if (selectedProductId) {
       attempt {
         dispatch(findProduct({ product_id: selectedProductId }));
         if (token) {
           ProductApi.isUsersProduct(token, selectedProductId).then((response) => {
             setIsUsers(response.information);
           });
         }
       } catch (error) {
         if (error.response) {
           swap (error.response.standing) {
             case 400:
             case 500:
               navigation.navigate('Residence');
           }
         }
       }
     }
   }, [selectedProductId]);

   useEffect(() => {
     borderWidths[activeMenu].worth = withTiming(3, { length: 500 });
   }, []);

   const handlePress = (index) => {
     setActiveMenu(index);
     borderWidths[index].worth = withTiming(3, { length: 500 });
   };

   useEffect(() => {
     fetchDetail();
   },  [fetchDetail]);

  useEffect(() => {
    if (currentProduct) {
      if (token && consumer) {
        if (currentProduct.likedBy.size > 0) {
          const isLiked = currentProduct.likedBy.some((val) => val.userId === consumer.id);
          setHeart((prevHeart) => ({
            ...prevHeart,
            [currentProduct.id]: isLiked,
          }));
        } else
          setHeart((prevHeart) => ({
            ...prevHeart,
            [currentProduct.id]: false,
          }));
      }
    }
  }, [currentProduct]);

  const handleHeart = () => {
    if (token && consumer && currentProduct) {
      setHeart((prevState) => ({ ...prevState, [currentProduct.id]: !coronary heart[currentProduct.id] }));
      const information = { [currentProduct.id]: !coronary heart[currentProduct.id] };
      attempt {
        dispatch(updateProductLike({ token, likes: information }));
      } catch (error) {
        if (error.response) {
          swap (error.response.standing) {
            case 400:
            case 401:
            case 500:
              navigation.navigate('Residence');
          }
        }
      }
    } else {
      alert('로그인이 필요합니다');
      navigation.navigate('Login');
      return;
    }
  };

  return {
    currentProduct,
    currentPage,
    handleHeart,
    handleHorizontalScroll,
    coronary heart,
    isUsers,
    handlePress,
    borderWidths,
    activeMenu,
    navigation,
    consumer,
    token,
  };
};

If there aren’t any issues with the above code, I might guess that there could also be a compatibility challenge with the put in dependencies. I have not posted many questions on StackOverflow, so please perceive my awkwardness.
I wish to resolve the issue shortly and deal with coding.

Latest news
Related news

LEAVE A REPLY

Please enter your comment!
Please enter your name here