【问题标题】:TypeError: interpolate is not a function after installing react-nativgation-drawerTypeError: 安装 react-navigation-drawer 后 interpolate 不是函数
【发布时间】:2021-07-24 10:28:53
【问题描述】:

我正在学习 react native,在此期间我试图实现抽屉导航,但是一旦我安装了 react-navigation-drawer(2.2.0),就会弹出这个错误。

行为: 加载时应用崩溃

复制: 只需重新加载应用程序

Package.js

{
      "main": "node_modules/expo/AppEntry.js",
      "scripts": {
        "start": "expo start",
        "android": "expo start --android",
        "ios": "expo start --ios",
        "web": "expo start --web",
        "eject": "expo eject"
      },
      "dependencies": {
        "expo": "~42.0.1",
        "expo-app-loading": "^1.1.2",
        "expo-status-bar": "~1.0.4",
        "react": "16.13.1",
        "react-dom": "16.13.1",
        "react-native": "https://github.com/expo/react-native/archive/sdk-42.0.0.tar.gz",
        "react-native-gesture-handler": "~1.10.2",
        "react-native-reanimated": "^2.1.0",
        "react-native-screens": "^3.4.0",
        "react-native-web": "~0.13.12",
        "react-navigation": "^4.4.4",
        "react-navigation-drawer": "^2.7.1",
        "react-navigation-stack": "^2.10.4"
      },
      "devDependencies": {
        "@babel/core": "^7.9.0"
      },
      "private": true
    } 

App.js

import React,{useState} from 'react';
import * as Font from 'expo-font';
import AppLoading  from 'expo-app-loading';
//import Navigator from './routes/homestack'
import Navigator from './routes/drawernav';




const loadFont = ()=>Font.loadAsync({
    'merrie-regular':require('./assets/fonts/Merriweather-Regular.ttf'),
    'merrie-bold':require('./assets/fonts/Merriweather-Bold.ttf')
  });

export default function App() {
  const [isFontLoaded,setFontLoaded] = useState(false);
  if(isFontLoaded){
    return (
      //initial changes again
       <Navigator/>
      
    );
  }else{ 
    return(
      
        <AppLoading
        startAsync = {loadFont}
        onFinish = {()=>setFontLoaded(true)}
        onError = {()=>alert('Error')}
        />
    );
  }
}

错误:

AppLoading threw an unexpected error when loading:
    TypeError: interpolate is not a function. (In 'interpolate(this.progress, {
                  inputRange: [PROGRESS_EPSILON, 1],
                  outputRange: [0, 1]
                })', 'interpolate' is undefined)     

**Already Tried:
1.Changing reanimated version
2.Uninstall and install reanimated version.
3.Uninstall and install drawer-navigation** 

注意:Android 和 IOS 模拟器上都有。

【问题讨论】:

    标签: javascript reactjs react-native navigation-drawer


    【解决方案1】:

    您的 react-navigation-drawer 版本与 react-native-reanimated 的版本冲突。尝试运行npm i --save react-native-reanimated@1.0.0

    将您的 react-native-reanimated 降级到版本 1.1.0 在终端中运行此命令 yarn add react-native-reanimated@1.0.0

    【讨论】:

    • 非常感谢。虽然我不确定降级时会带来什么缺点,但是否有任何文档可以进行这种比较?
    • @AshutoshBhardwaj 你没有使用最新版本的react-navigation-drawer,这就是为什么你也需要降级你的复活库。如果您想使用最新版本,那么您还需要升级您的 drawer 库。而且,不使用任何库的最新版本也没有缺点。
    • 其实我是从最新的抽屉版本 2.2.0 开始的,然后应用程序崩溃了,不是最新的吗
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-09-05
    • 1970-01-01
    • 2023-03-21
    • 2021-05-07
    • 1970-01-01
    • 2022-12-22
    • 2021-10-18
    相关资源
    最近更新 更多