如果你的 React Native 版本较新，它提供一个主题API useColorScheme，你可以直接使用它。如果不是，需安装额外的库，如react-native-appearance。

下面是一个使用 react-native-appearance（或 useColorScheme）的简单示例：

使用 react-native-appearance

需要安装 react-native-appearance（如果它还不是 React Native 的一部分）。

npm install react-native-appearance  
# 或者  
yarn add react-native-appearance

然后，你可以在你的组件中使用它：

import React, { useEffect, useState } from 'react';  
import { Text, View } from 'react-native';  
import { useColorScheme } from 'react-native-appearance';  const DynamicThemeComponent = () => {  // 使用 useColorScheme Hook 获取当前颜色方案  const colorScheme = useColorScheme();  // 根据颜色方案设置主题  const theme = colorScheme === 'dark' ? 'darkTheme' : 'lightTheme';  // 这里可以根据 theme 变量来设置组件的样式  // 但为了简化示例，我们直接在文本中显示当前的颜色方案  return (  <View>  <Text>当前颜色方案: {colorScheme}</Text>  {/* 这里可以添加更多的组件，并使用 theme 变量来设置它们的样式 */}  </View>  );  
};  export default DynamicThemeComponent;

使用 useColorScheme（内置于 React Native）

如果你的 React Native 版本较新，并且 useColorScheme 已经内置，你可以直接使用它，而无需安装额外的库：

import React from 'react';  
import { Text, View, useColorScheme } from 'react-native';  const DynamicThemeComponent = () => {  // 使用 useColorScheme Hook 获取当前颜色方案  const colorScheme = useColorScheme();  // 根据颜色方案设置组件的样式  const textColor = colorScheme === 'dark' ? 'white' : 'black';  const backgroundColor = colorScheme === 'dark' ? 'black' : 'white';  return (  <View style={{ backgroundColor }}>  <Text style={{ color: textColor }}>当前颜色方案: {colorScheme}</Text>  {/* 其他组件 */}  </View>  );  
};  export default DynamicThemeComponent;