Как изменить цвет background WebView в React native?

Question

[ASQWZS]

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

export default class TestScreen extends Component {
  render() {
    return  (
        <View >
            <TouchableOpacity}>
             <WebView>
           </TouchableOpacity>

        </View>
    );
  }
}

У меня сперва загружается WebView и после него пользоваетль нажимает TouchableOpacity.И как сделать чтобы после нажатия background WebView изменился без перезагузкой WebView?

Comments

[Роман Александрович]

если я вас правильно понял

export default class TestScreen extends Component {
changeColor=()=>{
this.bridge.injectJavaScript('document.body.style.backgroundColor = "black";');
}
  render() {
    return  (
        <View >
            <TouchableOpacity onPress={()=>this.changeColor()}>
             <WebView 
ref={(bridge)=>this.bridge=bridge}
javaScriptEnabled={true}
style={{backgroundColor:"black"}}
>
           </TouchableOpacity>

        </View>
    );
  }
}

Answer 1

[Nick]

Смотря что отображается в webview. Если ваша страница, то можно решить в лоб кидая postMessage, ловить его на стороне отображаемого контента и изменять стиль страницы.