小编Stu*_*dji的帖子

我有我的“应用程序组件”和“B 组件”，它们在我的应用程序组件内呈现。每个都有自己的风格。

但是当它被编译时，我的 ComponentB.css 被放在我的 app.css 之前，使得 ComponentB 样式被我的应用程序样式覆盖。

为什么会出现这种情况？？

应用程序

 import React, { Component } from 'react';
 import ComponentB from './components/ComponentB';
import './styles/app.css';

    class App extends Component {
      render() {
        return (
          <div className="App">
            <ComponentB />
          </div>
        );
      }
    }

    export default App;

成分B

import React, { Component } from 'react';
import './styles/ComponentB.css';

class ComponentB extends Component {
  render() {
    return (
      <div>
        <h1>Hello from ComponentB</h1>
      </div>
    );
  }
}

export default ComponentB;

我正在使用该react-native-dimension库使我的 UI 响应如下：

const{width,height} = Dimensions.get('window');

在我的 style.js 文件中：

imageBackgroundLandscape:{
    width:height,
    height:width

},
imageBackgroundPortrait:{
    width:width,
    height:height
}

问题是，当我旋转屏幕时，宽度和高度变量已经得到以前的值！例如，在肖像模式下，我的变量是：

width : 800
height: 1280

当我旋转屏幕时，我的变量是：

width : 800 // previous value
height: 1280 // previous value

另外，我使用react-native-orientation来确定屏幕的模式。我想知道当我旋转设备时如何自动更改它们的值（宽度，高度），或者是否有其他库可以实现此目的？

提前致谢。