ExceptionsManager.js:179 錯誤：無效的掛鉤呼叫。鉤子只能在函陣列件的主體內部呼叫。這可能由于以下原因之一而發生：
- 你可能有不匹配的 React 版本和渲染器（例如 React DOM）
- 您可能違反了 Hooks 規則
- 你可能在同一個應用程式中擁有多個 React 副本
在 Playbutton 組件中出現此錯誤
播放按鈕.js
import { useNavigation } from "@react-navigation/native";
import React, { useEffect, useState, useRef } from "react";
import { useSelector, useDispatch } from "react-redux";
import {
View,
Button,
StyleSheet,
Image,
TouchableOpacity,
Dimensions,
NativeModules,
} from "react-native";
var deviceHeight = Dimensions.get("window").height;
var deviceWidth = Dimensions.get("window").width;
import useAppleFunction from "../CustomHooks/useAppleFunction";
const PlayButton = () => {
useEffect(() => {
useAppleFunction();
}, []);
}
這是自定義鉤子 useApplefunction.js
import { StyleSheet, Text, View } from "react-native";
import React, { useEffect } from "react";
import { useSelector } from "react-redux";
const useAppleFunction = () => {
const Playlist = useSelector((state) => state);
console.log("reduxcheck=",Playlist);
useEffect(() => {
runtimer();
}, []);
const runtimer = () => {
console.log("reduxcheck=1",Playlist);
};
};
export default useAppleFunction;
const styles = StyleSheet.create({});
uj5u.com熱心網友回復：
React 的錯誤資訊非常豐富，有些是被動攻擊性的，讓你因為沒有閱讀足夠的檔案而感到難過。
第一條線索是“只能在函陣列件的主體內部呼叫 Hooks。” ，你在另一個鉤子中呼叫你的自定義鉤子。
此外，在列出的 3 個原因中，似乎只有一個與您的情況相匹配，它是 #2，您違反了react hooks 的規則。
因此，與其在 useEffect 中呼叫 useAppleFunction 掛鉤，不如在頂層呼叫它并將回傳的值（在您的情況下，沒有）保存到變數中。
uj5u.com熱心網友回復：
一個鉤子不需要回傳任何東西，因此如果useAppleFunction應該是一個鉤子，那么這很好。但是，這不應該在 a 中呼叫useEffect。
這在此處記錄。
為避免混淆，其他情況下不支持呼叫 Hooks：
?? 不要在類組件中呼叫 Hooks。
?? 不要呼叫事件處理程式。
?? 不要在傳遞給 useMemo、useReducer 或 useEffect 的函式中呼叫 Hooks。
由于您的鉤子不回傳任何內容，因此只需在useEffect. 如果你的鉤子實際上應該回傳一些東西，那么我們可以像往常一樣解構它。
備注：不再需要使用var。它已經過時了。我已將其更改為const.
這是您可以解決的方法。
我假設的Playbutton.js應該是一個 JSX 組件。
import { useNavigation } from "@react-navigation/native";
import React, { useEffect, useState, useRef } from "react";
import { useSelector, useDispatch } from "react-redux";
import {
View,
Button,
StyleSheet,
Image,
TouchableOpacity,
Dimensions,
NativeModules,
} from "react-native";
import useAppleFunction from "../CustomHooks/useAppleFunction";
const deviceHeight = Dimensions.get("window").height;
const deviceWidth = Dimensions.get("window").width;
const PlayButton = () => {
// since this is a hook, it is not allowed to call it inside a useEffect
useAppleFunction()
useEffect(() => {
}, []);
//
}
uj5u.com熱心網友回復：
是的，問題是你試圖Dimensions在函式之外使用，你得到了錯誤。
而不是這樣，你應該只在imports.
import { useNavigation } from "@react-navigation/native";
import React, { useEffect, useState, useRef } from "react";
import { useSelector, useDispatch } from "react-redux";
import {
View,
Button,
StyleSheet,
Image,
TouchableOpacity,
Dimensions,
NativeModules,
} from "react-native";
import useAppleFunction from "../CustomHooks/useAppleFunction";
const PlayButton = () => {
var deviceHeight = Dimensions.get("window").height;
var deviceWidth = Dimensions.get("window").width;
useEffect(() => {
useAppleFunction();
}, []);
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/443816.html
標籤：javascript 反应 反应式