即使 app.json web 更改后，React 本机 Web 应用程序也不会更改背景颜色

Question

我正在使用 React Native 构建我的应用程序。我希望所有三个平台都有相同的代码和 UI。 Web、Android 和 IOS。这是我的 app.json 文件

{
  "expo": {
    "name": "game-app",
    "slug": "game-app",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/icon.png",
    "userInterfaceStyle": "light",
    "backgroundColor": "#14206b",
    "splash": {
      "image": "./assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#14206b"
    },
    "ios": {
      "supportsTablet": true
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./assets/adaptive-icon.png",
        "backgroundColor": "#14206b"
      }
    },
    "web": {
      "favicon": "./assets/favicon.png",
      "backgroundColor": "#14206b"
    }
  }
}

我想做的是更改我的网络应用程序中整个应用程序设置的背景颜色。我已经像上面的代码一样更改了 app.json 。但它仍然不起作用。它在我的安卓上运行良好。 这是JS代码：

App.js

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import StartGameScreen from './screens/StartGameScreen';

export default function App() {
  return (
    <StartGameScreen/>

  );
}

const styles = StyleSheet.create({});

StartGameScreen.js

import {View, TextInput} from 'react-native'
import PrimaryButton from '../components/PrimaryButton';
import { StyleSheet } from 'react-native';
import { Platform } from 'react-native';


function StartGameScreen() {

    return (
        <View style={styles.inputContainer}>
            <TextInput/>
            <PrimaryButton>Reset</PrimaryButton>
            <PrimaryButton>Confirm</PrimaryButton>
        </View>
    )

}

export default StartGameScreen;

const styles = StyleSheet.create({
    inputContainer: {
        padding: 16,
        height: Platform.OS === 'web' ? 100 : 100,
        marginTop: 100,
        margin: 50,
        backgroundColor: '#72063c',
        alignItems: 'center',
        width: Platform.OS === 'web' ? '95vw' : '95vw', // Adjust width for web
    }}
)

Answer 1

由于 app.json 中的内容正在更改，因此重新加载可能会起作用。它也适用于我。还要确保 inputContainer 覆盖整个屏幕，因为它具有不同的颜色。由于您使用的是 95vw，我想您可以看到不同的背景颜色。