Question

这里是代码:(在代码中注意注意）

import React, { Component } from 'react';
import {Container, Tab, Tabs, TabHeading, Icon, Text } from 'native-base';
import style from './../styles/compoCss' ;
import NewDB from './../database/NewDB';
import Category from "../lists/Category";
import HomePage from  './../tabs/HomePage'

export default class TabHome extends Component {
render() {
    return (
        <Container>
            <Tabs initialPage={3} > //THIS CODE DOESN'T WORK :(
                <Tab heading={
                    <TabHeading style={style.footerTabHome}>
                        <Icon name="md-aperture" style={style.iconFooter} />
                        <Text style={style.textFooter}>New</Text>
                    </TabHeading>}>
                    <NewDB/>
                </Tab>
                <Tab heading={
                    <TabHeading style={style.footerTabHome}>
                        <Icon name="md-bookmark" style={style.iconFooter} />
                        <Text style={style.textFooter}>Bookmark</Text>
                    </TabHeading>}>

                </Tab>
                <Tab heading={
                    <TabHeading style={style.footerTabHome}>
                        <Icon active name="md-apps" style={style.iconFooter}  />
                        <Text style={style.textFooter}>Catalog</Text>
                    </TabHeading>}>
                    <Category/>
                </Tab>
                <Tab heading={
                    <TabHeading style={style.footerTabHome}>
                        <Icon name="md-home" style={style.iconFooter} />
                        <Text style={style.textFooter}>Home</Text>
                    </TabHeading>} >
                    <HomePage/>
                </Tab>
            </Tabs>
        </Container>
    );
  }
}

当我构建应用程序或刷新它时，默认选项卡是3（主页），我认为它是正确的，但不显示主页内容，当我滚动时，我发现它是在标签0中的堆栈（新）... 我搜索所有的论坛，我无法解决我的问题。请帮助谢谢！（这个问题在android设备中）

Answer 1

我也面临此问题，并通过以下示例代码解决了该问题。

from math import factorial

def rf(f):
    d=2
    while f//factorial(d) != 1:
        if f//factorial(d) <= 1:
            print("Entered number is not a factorial")
            return
        d += 1
    return int(d)

rf(factorial(171))
# 171

Answer 2

此代码欺骗了这个问题（但我不想解决initialPage）

... 
class TabHome extends Component {
  componentDidMount(){
  setTimeout(this._tabs.goToPage.bind(this._tabs,1))
}
render(){
  return ...
   <Tabs ref={component => this._tabs = component}>
     ...
   </Tabs>
   ....
  }
}

如果是因为本机基础中的错误，我们必须等待更新。但除了请帮助:)）

Answer 3

我发现了一个窍门：本机基础：2.8.2 在componentDidMount（）中：

componentDidMount() {
    const { initialPage } = this.props; //or use state
    setTimeout(this.tabs.goToPage.bind(this.tabs, initialPage));
}

在render（）标签中：

<Tabs
    ref={(c) => { this.tabs = c; return; }}
...

来源：https://github.com/GeekyAnts/NativeBase/issues/1010#issuecomment-448201520

react-native nativeBase选项卡initialPage更改为3但仍然从选项卡0开始

3 个答案: