React Native固定页脚不会停留在滚动上

import React from 'react';
import { ScrollView, View, Text } from 'react-native';

const App = () => {
  return (
    <View style={{ flex: 1 }}>
      <ScrollView contentContainerStyle={{ flexGrow: 1 }}>
        {/* 页面内容 */}
      </ScrollView>
      {/* 固定的页脚 */}
      <View style={{ backgroundColor: 'gray', height: 50 }}>
        <Text style={{ color: 'white', textAlign: 'center' }}>固定页脚</Text>
      </View>
    </View>
  );
};

export default App;

import React from 'react';
import { FlatList, View, Text } from 'react-native';

const App = () => {
  const data = [...]; // 数据源

  return (
    <View style={{ flex: 1 }}>
      {/* 页面内容 */}
      <FlatList
        data={data}
        renderItem={({ item }) => (
          <View>
            {/* 渲染每一项 */}
          </View>
        )}
        ListFooterComponent={() => (
          <View style={{ backgroundColor: 'gray', height: 50 }}>
            <Text style={{ color: 'white', textAlign: 'center' }}>固定页脚</Text>
          </View>
        )}
      />
    </View>
  );
};

export default App;