当有很多标签时反应本机标签视图宽度

Question

我正在使用https://github.com/react-native-community/react-native-tab-view 但是我的问题是

1. 当有很多标签时，它只会在屏幕上显示，并且高度会扩大。我要寻找的是高度是固定的，宽度根据制表符而扩展
2. 在选项卡之间移动时，似乎会重新加载每个选项卡上的视图

感谢您提出的所有解决问题的建议。谢谢

Answer 1

您可以在.

中指定width: 'auto'

Answer 2

<TabView
  labelStyle={fontSize:12} //---------->Add this line and reduce the fontsize
  navigationState={this.state}
  onIndexChange={index => this.setState({ index })}
  renderScene={SceneMap({
    first: FirstRoute,
    second: SecondRoute,
  })}
/>

Answer 3

您需要在_renderLabel函数中导出标题。...

       _renderLabel = ({ route }) => (
           <Text style={styles.label}>{route.title}</Text>
       );

        <TabBar
            {...props}
            scrollEnabled={true}
            renderIndicator={() => null}
            ref={component => this.scrollRef = component}
            renderLabel={this._renderLabel}
            tabStyle={styles.tab}
            style={{ backgroundColor: '#284062'}}
        />

此后，您可以设置文本样式：）

Answer 4

尝试添加：

style={{ width: 300 }}

并给出如下样式的宽度：

@Autowired
DataSource dataSource;
....
JasperPrint jasperPrint = JasperFillManager.fillReport(jasperReport, parameters, dataSource.getConnection());

您可以在此处了解更多信息：https://github.com/react-native-community/react-native-tab-view