这是我的第一个真实的的移动的应用程序,当我试图实现auth和路由时,我遇到了一些问题-错误消息和我猜测的功能太多
我的应用程序目前有两个堆栈,一个是auth堆栈,另一个是drawer堆栈。我将auth堆栈作为默认堆栈,并希望在用户登录时显示drawer堆栈。如果用户已注销,则显示auth堆栈,直到用户登录。
我在根堆栈导航器中有一行代码
{ auth ? <Stack.Screen name="Auth" component={AuthStack} />:<Stack.Screen name="Drawer" component={DrawerStack} />}
在我的堆栈导航器上面有一行
const { auth } = checkAuth()
使用正确的文件路径导入
import { AuthProvider, checkAuth } from '../context/AuthContext'
下面是导入的基本代码
const AuthProvider = ({ children }) => {
const [auth, setAuth] = useState(null);
const checkAuth = () => {
try {
const authData = globalStorage.getString('accessToken')
if(authData !== null && authData !== undefined) {
setAuth(authData)
}
} catch(e) {
console.error(e)
}
}
const removeAuth = () => {...};
const setAuthState = data => {
try {
console.log('setAuthState Data: ', data)
globalStorage.set('accessToken', data)
setAuth(data);
} catch (err) {
console.error(err);
}
};
useEffect(() => {
checkAuth();
}, []);
return (
<AuthContext.Provider value={{ auth, setAuthState, removeAuth}}>
{children}
</AuthContext.Provider>
);
};
我在iOS模拟器中看到的错误信息是checkAuth
不是函数。我不知道为什么在我导入时不是。我尝试将AuthProvider
作为prepend添加,但没有成功。我确定这是一个简单的React操作,但我不确定,因为我在Node.js工作时通常不会这样编码。
1条答案
按热度按时间kwvwclae1#
checkAuth
的作用域是AuthProvider
。如果您希望将其提供给AuthContext
的使用者,则需要将其包含在AuthContext.Provider
的value
属性中,但我认为您只需要使用已经提供给使用者的auth
。下面是有关
useContext
挂钩的一些信息,您可以通过该挂钩访问这些属性。https://reactjs.org/docs/hooks-reference.html#usecontext