水平滚动视图不滚动？答案

【问题标题】：Horizontal scroll View not scroll?水平滚动视图不滚动？
【发布时间】：2020-02-21 11:55:54
【问题描述】：

我正在使用 react native 项目，但我有一个问题，即我的水平滚动视图不想滚动它与 ios 一起使用，但 android 不，我正在使用原生基本选项卡，所以我有两个屏幕，第一个是垂直的滚动工作正常，但第二个水平不工作你知道吗？我尝试添加 nestedScrollEnabled 道具但不起作用

标签代码

 <Tabs
   tabBarUnderlineStyle={tabBarUnderlineStyle}
   tabContainerStyle={tabContainerStyle}>
   <Tab
     heading={strings.info}
     tabStyle={tabStyle}
     activeTabStyle={tabStyle}
     textStyle={textStyle}
     activeTextStyle={activeTextStyle}>
     <Info />
   </Tab>
   <Tab
     heading={strings.state}
     tabStyle={tabStyle}
     activeTabStyle={tabStyle}
     textStyle={textStyle}
     activeTextStyle={activeTextStyle}>
     <State />
   </Tab>
 </Tabs>

这是我遇到问题的屏幕

 <View style={container}>
   <View style={itemsContainer}>
     <View>
       <ScrollView horizontal nestedScrollEnabled={true}>
         <HeaderItem label={Strings.ca} />
         <HeaderItem label={Strings.packs} />
         <HeaderItem label={Strings.terme} />
         <HeaderItem label={Strings.sinistre} />
         <HeaderItem label={Strings.attestation} />
       </ScrollView>
     </View>
   </View>
 </View>

【问题讨论】：

标签： react-native react-native-android expo native-base

【解决方案1】：

import React, { Component } from 'react';
import { View, StyleSheet } from 'react-native';
import { TabViewAnimated, TabViewPage, TabBarTop } from 'react-native-tab-view';

export default class TabViewExample extends Component {
  state = {
    index: 0,
    routes: [
      { key: '1', title: 'First' },
      { key: '2', title: 'Second' },
    ],
  };

  _renderScene = ({ route }) => {
    switch (route.key) {
    case '1':
      return <View style={{ flex: 1, backgroundColor: '#ff4081' }} />;
    case '2':
      return <View style={{ flex: 1, backgroundColor: '#673ab7' }} />;
    default:
      return null;
    }
  };

  _renderPage = (props) => <TabViewPage {...props} renderScene={this._renderScene} />;

  render() {
    return (
      <TabViewAnimated
        style={{ flex: 1 }}
        navigationState={this.state.navigation}
        renderScene={this._renderPage}
        renderHeader={this._renderHeader}
        onRequestChangeTab={index => this.setState({ index })}
      />
    );
  }
}

【讨论】：