從父級到子級組件響應本機不透明度

Question

我是opacity: 0.6 ImageBackground opacity: 0.6樣式中為opacity: 0.6 。 這包裝了我的其他組件。 這種不透明度導致子組件的不透明度降低。 如何在子組件（如View覆蓋樣式。

Answer 1

您可以通過在子組件中對該文件應用樣式來覆蓋該樣式。 最晚應用的樣式是給定的優先事項。 例如，以下將呈現藍色。

import React from "react";
import { render } from "react-dom";

const stylesA = {
  color: "red"
};

const stylesB = {
  color: "blue"
};

const B = () => <div style={stylesB}>hey there</div>;

const A = ({ children }) => (
  <div style={stylesA}>
    <B />
  </div>
);

render(<A />, document.getElementById("root"));

此處的示例： https : //codesandbox.io/s/vm6o1jx49l

Answer 2

場景是您無法覆蓋“ Opacity屬性。 但是為了實現我想要的，我遵循了這個家伙不得不說的話

React-Native：更改ImageBackground的不透明度顏色

Answer 3

不要使用不透明度。 在這樣的背景顏色道具中使用它-

backgroundColor：'rgba（0，0，0，0.6）'