React native （0，_reactI18next.translate）不是函数

事实上，我对react母语还不熟悉，在这里我试图使用'react-i18next'将语言更改为阿拉伯语，但执行时出现以下错误：

反应性▶︎ （0，_reactI18next.translate）不是函数。（在 '（0，_reactI18next.translate）（'common'{ bindI18n:“语言已更改”， bindStore:错误 })“，”（0，_reactI18next.translate）”未定义）

这是我的密码

import React from 'react';
import AppNavigator from './src/controller/AppNavigator';
import { translate } from 'react-i18next';
// import i18n from './src/I18n/index';
console.reportErrorsAsExceptions = false;

const WrappedStack = ({ t }) => {
  return <AppNavigator screenProps={{ t }} />;
};
const ReloadAppOnLanguageChange = translate('common', {
  bindI18n: 'languageChanged',
  bindStore: false,
})(WrappedStack);

export default class App extends React.Component {
  render() {
    return (
      <ReloadAppOnLanguageChange/>
    );
  }
}

使用

withTranslation（）

代替

translate（）

HOC。 迁移文档中似乎缺少这个

import {
    createStackNavigator,
    createAppContainer,
} from 'react-navigation';
import SScreen from '../view/sScreen/SScreen';
import Login from '../view/login/Login';
import SignUp from '../view/signUp/SignUp';
import TabNavigation from '../controller/TabNavigation';
import ForgotPassword from '../view/forgotPassword/ForgotPassword';
import AddAppointment from '../view/addAppointment/AddAppointment';
import DrProfile from '../view/drProfile/DrProfile';
import PaymentHistory from '../view/paymentHistory/PaymentHistory';


const AppNavigator = createStackNavigator({
    SScreen: {
        screen: SScreen,
        navigationOptions: {
            header: null
        }
    },
    Login: {
        screen: Login,
        navigationOptions: {
            header: null
        }
    },
    SignUp: {
        screen: SignUp,
        navigationOptions: {
            header: null
        }
    },
    ForgotPassword: {
        screen: ForgotPassword,
        navigationOptions: {
            header: null
        }
    },
    TabNavigation: {
        screen: TabNavigation,
        navigationOptions: {
            header: null,
            title: "TabNavigation",
            headerStyle: {
                backgroundColor: '#B78FC3',
            },
            headerTintColor: 'white',
            headerTitleStyle: {
                fontWeight: 'bold',
            },
            headerTitleStyle: {
                flex: 1,
                textAlign: 'center',
            },
            headerLeft: null
        },
    },
    AddAppointment: {
        screen: AddAppointment,
        navigationOptions: {
            title: "Add An Appointment",
            headerStyle: {
                backgroundColor: '#B78FC3',
            },
            headerTintColor: 'white',
            headerTitleStyle: {
                fontWeight: 'bold',
            },
            headerTitleStyle: {
                flex: 1,
                textAlign: 'center',
            },
        },
    },
    DrProfile: {
        screen: DrProfile,
        navigationOptions: {
            headerStyle: {
                backgroundColor: '#B78FC3',
            },
            headerTintColor: 'white',
            headerTitleStyle: {
                fontWeight: 'bold',
            },
            headerTitleStyle: {
                flex: 1,
                textAlign: 'center',
            },
        },
    },
    PaymentHistory: {
        screen: PaymentHistory,
        navigationOptions: {
            title: "Payment History",
            headerStyle: {
                backgroundColor: '#B78FC3',
            },
            headerTintColor: 'white',
            headerTitleStyle: {
                fontWeight: 'bold',
            },
            headerTitleStyle: {
                flex: 1,
                textAlign: 'center',
            },
        },
    },
},
    { headerLayoutPreset: 'center' });


const App = createAppContainer(AppNavigator);
export default App;