web-dev-qa-db-ja.com

'_react ["default"]。memoの修正方法は関数ではありません。 （ '_react ["default"]。memo（connectFunction）' in React native？

コンテナーを介してRedux mapStateToProps（）およびmapActionCreators（）をログイン画面に接続しようとしていますが、Reactナビゲーションを使用しています。

アプリをビルドすると、次のエラーメッセージが表示されます。

_react ["default"]。memoは関数ではありません。 （「_react ["defaults"]。memo（connectFunction）」では、「_ react ["defaults"]。memo」は未定義です。

しばらく検索しましたが、React.memo（）がコンポーネントの再レンダリングのタイミングを制御するのに役立ちますが、React.memo（）に関連するコードは使用していません。

ログイン画面：（screens/LoginScreen/index.js）

import React from 'react';
import {Dimensions, View} from 'react-native';

//Get width of mobile screen
var width = Dimensions.get("window").width;
var height = Dimensions.get("window").height;

export default class LoginScreen extends React.Component {
    constructor(props){
        super(props);
        this.state = {

        }
    }

    render() {
        return (
            <View style={styles.container}>
                <Text>Log In page</Text>
            </View>
        );
    }
}

LoginScreen.defaultProps = {
}

const styles = {
    container: {
        flex: 1
    }
}

ログイン画面コンテナ：（containers/LoginContainer/index.js）

import {connect} from "react-redux";
import LoginScreen from "../../screens/LoginScreen";

const mapStateToProps = (state) =>({

});


const mapActionCreators = {

};
export default connect(mapStateToProps, mapActionCreators)(LoginScreen);

トップレベルのナビゲーション：（navigations/TopLevelSwitchNav.js）

import {createSwitchNavigation, createAppContainer} from 'react-navigation';
import LoginScreen from '../containers/LoginContainer';
import MainTabNav from './MainTabNav';


const TopLevelSwitchNav = createSwitchNavigation({
    Login:  {
        screen: LoginScreen,
        navigationOptions: {
            header: null
        }
    },
    MainTab: {
        screen: MainTabNav,
        navigationOptions: {
            header: null
        }
    }
},
{
    initialRouteName: Login,
    navigationOptions: { header: null }
});

export default createAppContainer(TopLevelSwitchNav);

依存関係：

"dependencies": {
    "expo": "^32.0.0",
    "react": "16.5.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
    "react-navigation": "^3.8.1",
    "react-redux": "^7.0.2",
    "redux": "^4.0.1",
    "redux-logger": "^3.0.6",
    "redux-persist": "^5.10.0",
    "redux-persist-transform-filter": "^0.0.18",
    "redux-thunk": "^2.3.0"
},
reactjsreact-nativereduxreact-reduxexpo
13
Ahmed Saeed

まだコメントできないので、これをAhmed Saeedの応答への追加として追加します above 。 4月17日現在、フックはExpoではまだサポートされていません。詳しくは こちら をご覧ください。 v.7.0.1からreact-redux

connectは、関数ではなく特別なオブジェクトを返すReact.memo（）を内部で使用するようになりました。

そして、それはフックで 書き換え です。 react-reduxをv.6.0.0にダウングレードすると役立ちます。

1
iWorld