使用useReducer会导致不变违规:只能在函数组件的主体内部调用挂钩

时间:2019-03-14 10:27:25

标签: reactjs react-native react-hooks

我在最新的React for React Native开发中遇到了一些问题,因为React引入了钩子,我想尝试使用它,但无济于事。我正在使用Screen for RN来做一些初始屏幕动画,并且它不适用于最新的React,总是给我上面的错误。 (它正在使用React版本16.7.0-alpha.2)。我在做错什么吗?

SplashScreen.js

import React, { useReducer } from "react";

const initialState = { currentIndex: 0 };

const reducer = ???;

const SplashScreen = (props: Props): ReactElement => {
  const [state, dispatch] = useReducer(reducer, initialState);

  return (
    <GestureRecognizer
      style={styles.container}
      config={gestureRecognizerConfig}
      onSwipe={direction => dispatch({ type: direction })}
    >(...)</GestureRecognizer>
  );
};

export default SplashScreen;

AppNavigator.js

import { createAppContainer, createSwitchNavigator } from "react-navigation";
import SplashScreen from "./SplashScreen.js";

export default createAppContainer(
  createSwitchNavigator(
    {
      Splash: SplashNavigator,
    },
    {
      initialRouteName: "Splash",
    },
  ),
);

App.js

const App = () => (
  <View>
    {Platform.OS === "ios" && <StatusBar barStyle="default" />}
      <AppNavigator
        persistenceKey={navigationPersistenceKey}
        renderLoadingExperimental={() => <ActivityIndicator />}
      />
  </View>
);

export default App;

0 个答案:

没有答案