Javascript transitionConfig在react native中不工作

我正在工作，我面临一个问题

    import React, { Component } from 'react'
import {createAppContainer, createSwitchNavigator } from 'react-navigation';
import {createDrawerNavigator} from 'react-navigation-drawer'
import {createStackNavigator} from 'react-navigation-stack';
import SignUpForm from './components/AuthScreens/SignUpForm'
import OwnSwipeable from './components/OwnSwipeable';
import SignIn from './components/AuthScreens/SignIn';
import * as firebase from 'firebase'
import LoadingScreen from './components/Screens/LoadingScreen';
import AdminHome from './components/AdminHome'
import { Easing } from 'react-native';
import { fromLeft } from "react-navigation-transition-config";
// Your web app's Firebase configuration
var firebaseConfig = {
    apiKey: "AIzaSyDWlxi-Q3KQV8KVeF4QT51AAMdqhkp4utg",
    authDomain: "hr-installments.firebaseapp.com",
    databaseURL: "https://hr-installments.firebaseio.com",
    projectId: "hr-installments",
    storageBucket: "hr-installments.appspot.com",
    messagingSenderId: "827714438348",
    appId: "1:827714438348:web:242b74c707649b7d74ee69"
  };
  // Initialize Firebase
firebase.initializeApp(firebaseConfig);

// transition of sliding screens
let SlideFromRight = (index, position, width) => {
  const inputRange = [index - 1, index, index + 1];
  const translateX = position.interpolate({
    inputRange: [index - 1, index, index + 1],
    outputRange: [width, 0, 0]
  })
  const slideFromRight = { transform: [{ translateX }] }
  return slideFromRight
};
let CollapseExpand = (index, position) => {
  const inputRange = [index - 1, index, index + 1];
  const opacity = position.interpolate({
    inputRange,
    outputRange: [0, 1, 1],
  });

  const scaleY = position.interpolate({
    inputRange,
    outputRange: ([0, 1, 1]),
  });

  return {
    opacity,
    transform: [
      { scaleY }
    ]
  };
};
const TransitionConfiguration = () => {
  return {
    transitionSpec: {
      duration: 750,
      easing: Easing.out(Easing.poly(4)),
      timing: Animated.timing,
      useNativeDriver: true,
    },
    screenInterpolator: (sceneProps) => {
      const { layout, position, scene } = sceneProps;
      const width = layout.initWidth;
      const { index, route } = scene
      const params = route.params || {}; // <- That's new
      const transition = params.transition || 'default'; // <- That's new
      return {
        collapseExpand: CollapseExpand(index, position),
        default: SlideFromRight(index, position, width),
      }[transition];
    },
  }
}


const MainNavigator = createDrawerNavigator({
  Home: {
    name: 'Home',
    screen: OwnSwipeable,
  },
});
// auth screen
const AuthStack = createStackNavigator({
  SignIn: SignIn,
  SignUpForm: SignUpForm
});
// screen for admin
const Admin = createDrawerNavigator({
  Home : {
    name : 'Admin',
    screen: AdminHome
  }
});
// main app
const App = createAppContainer(
  createSwitchNavigator(
    {
      Loading: LoadingScreen,
      App: MainNavigator,
      Auth: AuthStack,
      Admin: Admin
    },
    {
      initialRouteName: 'Loading',
      transitionConfig: () => fromLeft(),
    }
  )
);

export default App;

import React，{Component}来自“React”
从“反应导航”导入{createAppContainer，createSwitchNavigator}；
从“react navigation drawer”导入{createDrawerNavigator}
从“反应导航堆栈”导入{createStackNavigator}；
从“./components/AuthScreens/SignUpForm”导入注册表单
从“./components/OwnSwipeable”导入OwnSwipeable；
从“/components/AuthScreens/SignIn”导入登录；
从“firebase”导入*作为firebase
从“./components/Screens/LoadingScreen”导入加载屏幕；
从“./components/AdminHome”导入AdminHome
从“react native”导入{Easing}；
从“反应导航转换配置”导入{fromLeft}；
//您的web应用程序的Firebase配置
var firebaseConfig={
apiKey：“AIzaSyDWlxi-Q3KQV8KVeF4QT51AAMdqhkp4utg”，
authDomain:“hr installants.firebaseapp.com”，
数据库URL:“https://hr-installments.firebaseio.com",
projectId:“人力资源分期付款”，
storageBucket:“hr installations.appspot.com”，
messagingSenderId：“827714438348”，
appId:“1:827714438348:web:242b74c707649b7d74ee69”
};
//初始化Firebase
firebase.initializeApp（firebaseConfig）；
//滑动筛的过渡
让SlideFromRight=（索引、位置、宽度）=>{
常量输入范围=[index-1，index，index+1]；
const translateX=位置.interpolate({
输入范围：[索引-1，索引，索引+1]，
outputRange:[宽度，0，0]
})
常量slideFromRight={transform:[{translateX}]}
返回幻灯片右键
};
让CollapseExpand=（索引，位置）=>{
常量输入范围=[index-1，index，index+1]；
const opacity=position.interpolate({
输入范围，
outputRange:[0,1,1]，
});
const scaleY=position.interpolate({
输入范围，
输出范围：（[0,1,1]），
});
返回{
不透明度
转换：[
{scaleY}
]
};
};
常量转换配置=（）=>{
返回{
过渡规格：{
持续时间：750，
放松：放松.out（放松.poly（4）），
计时：动画。计时，
useNativeDriver：没错，
},
屏幕插值器：（场景操作）=>{
常量{布局、位置、场景}=场景操作；
常量宽度=layout.initWidth；
常数{index，route}=场景
const params=route.params | |{}；//fromleet（），
}
)
);
导出默认应用程序；

我正在使用

反应导航过渡

内置组件，但没有过渡工作，我使用

过渡配置：过渡配置

TransitionConfiguration是一个定义的函数。。。

---

但这也不起作用，我已经尝试了几乎所有的方法来实现屏幕转换，但没有任何帮助。请查看是否有人知道这个问题。

我使用了react native transitions，它工作正常检查下面的代码：

:

---

我使用了react navigation stack及其与navigation 4.X的配合：

从“反应导航堆栈”导入{createStackNavigator，TransitionPresets}；
const AppStack=createStackNavigator(
{
主屏幕：{
屏幕：主页，
},
机场会议：{
屏幕：AirportMeeting，
},
},
{
initialRouteName:“HomeCard”，
默认导航选项：{
…TransitionPresets.SlideFromRightIOS，
},
},
);

在导航5.x中

导入{
createStackNavigator，
转换预设，
}来自“@react导航/堆栈”
({
…TransitionPresets.SlideFromRightIOS，
})}
>

您可能正在使用旧版本的react navigation…我正在使用V4。您找到解决方案了吗？我也遇到了这个问题

import {fromRight} from 'react-navigation-transitions';
    const AppStack = createStackNavigator(
      {
        HomeScreen: {
          screen: Home,
        },
        AirportMeeting: {
          screen: AirportMeeting,
        },
        FAQ: {
          screen: FAQ,
        },
        Support: {
          screen: Support,
        },
        BeforeTravel: {
          screen: BeforeTravel,
        },
      },
      {
        defaultNavigationOptions: {
          headerShown: false,
        },
        initialRouteName: 'HomeCard',
        transitionConfig: () => fromRight(),
      },
    );