在options中设置cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS即可

options={{
  cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
}}
import React from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {
  createStackNavigator,
  CardStyleInterpolators,
} from '@react-navigation/stack';
import Home from './pages/home';
import ReservePlan from './pages/reservePlan/index';
import DangerIndex from './pages/danger/index';
import ReserveDetail from './pages/reservePlan/detail';
const Stack = createStackNavigator();

class Index extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      initialRouteName: 'Home',
    };
  }

  render() {
    const {initialRouteName} = this.state;
    return (
      <NavigationContainer>
        <Stack.Navigator headerMode="none" initialRouteName={initialRouteName}>
          <Stack.Screen
            name="Home"
            options={{
              cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
            }}
            component={Home}
          />
          <Stack.Screen
            name="ReservePlan"
            options={{
              cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
            }}
            component={ReservePlan}
          />
          <Stack.Screen
            name="DangerIndex"
            options={{
              cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
            }}
            component={DangerIndex}
          />
          <Stack.Screen
            name="ReserveDetail"
            options={{
              cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
            }}
            component={ReserveDetail}
          />
        </Stack.Navigator>
      </NavigationContainer>
    );
  }
}
export default Index;

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐