与演示代码

时间:2017-06-28 14:17:13

标签: javascript ios react-native react-navigation expo

我正在尝试制作一个简单的标签导航应用,并使用Expo客户端应用来查看该应用。

问题:标签导航非常慢。与此处的Expo客户端演示应用相比,react-navigation并点击标签示例,转换速度更快。

我尝试做什么

1。我尝试将其设为严格的tabNavigation应用程序而不用堆栈导航封装它,这确实提升了性能一点点,但它仍然没有像由react-navigation提供的演示。

2. 由于演示应用程序在Expo应用程序上的运行速度更快,因此将应用程序捆绑并通过Xcode进行部署是没有意义的,但是我做了,但它仍然是滞后。

我不太确定此时可能出现的问题。其他问题提到日志记录(console.log)导致延迟,但我不确定代码的来源,所以我没有尝试删除它。

如果有人能够确认React-Navigation是否与原生api桥接,那将会很有帮助。

感谢您的帮助。

这可能会有所帮助:

React native version:0.44.0

反应导航版本:1.0.0-beta.11

继承代码我正在部署

    import React from 'react';
import {AppRegistry,Text,Image} from 'react-native';
import { TabNavigator,StackNavigator } from 'react-navigation';


class Tab1 extends React.Component {
  static navigationOptions = {
    title:"tab1",
    tabBarIcon: ({tintColor}) => (
        <Image
          source={require("./image1.png")}
          style={{width:26, height:28,tintColor: tintColor}}
        />
      ),

    };
  render(){
    return(
      <Text> tab1</Text>
    );
  }
};
class Tab2 extends React.Component {
  static navigationOptions = {
    title:"tab2",
    tabBarIcon: ({tintColor}) => (
        <Image
          source={require("./image2.png")}
          style={{width:15, height:27,tintColor: tintColor}}
        />
      ),
    };
  render(){
    return(
      <Text>tab2 </Text>
    );
  }
};

const MainTabNavCollection = TabNavigator({
  Tb1 : {screen: Tab1 },
  Tb2 : {screen: Tab2 },
},{
  tabBarOptions: {
    activeTintColor: "#CC0000",
  },
});

const styles = StyleSheet.create({
  icon: {
    width: 26,
    height: 26,
  },
});

const StackNav = StackNavigator({
  one: {screen: MainTabNavCollection}
});

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

0 个答案:

没有答案