微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

黑暗主题无法应用于Webview来响应本机android应用

如何解决黑暗主题无法应用于Webview来响应本机android应用

黑暗主题已为React Native expo应用程序正确设置,并在任何地方均可正常使用,但是当我将主题切换为黑暗时,除Web视图外,其他所有功能均正常运行。

如何在按钮开关上将webview部分转换为深色主题

这是我的代码,是否有任何条件条件适用于让jscode使用的代码

对React Native有所了解...如果不清楚说明的话,请通知

/** @format */

import React,{ PureComponent } from "react";
import { View } from "react-native";
import { WebView } from "react-native-webview";
import { Color,Styles,withTheme } from "@common";
import { CustomPage } from "@containers";
import { Menu,NavBarlogo,Back } from "./IconNav";

@withTheme
export default class CustomPageScreen extends PureComponent {
  static navigationoptions = ({ navigation }) => {
    const headerStyle = navigation.getParam(
      "headerStyle",Styles.Common.toolbar()
    );
    const dark = navigation.getParam("dark",false);
    const isBack = navigation.getParam("isBack",false);
    return {
      headerTitle: NavBarlogo({ navigation }),headerLeft: isBack ? Back(navigation) : Menu(dark),headerTintColor: Color.headerTintColor,headerStyle,headerTitleStyle: Styles.Common.headerStyle,};
  };

  UNSAFE_componentwillMount() {
    const {
      theme: {
        colors: { background },dark,},} = this.props;

    this.props.navigation.setParams({
      headerStyle: Styles.Common.toolbar(background,dark),});
  }

  componentwillReceiveProps(nextProps) {
    if (this.props.theme.dark !== nextProps.theme.dark) {
      const {
        theme: {
          colors: { background },} = nextProps;
      this.props.navigation.setParams({
        headerStyle: Styles.Common.toolbar(background,});
    }
  }

  render() {
    const { state } = this.props.navigation;
    if (typeof state.params === "undefined") {
      return <View />;
    }
let jsCode = `
            document.querySelector('header').style.display = 'none';
            document.querySelector('footer').style.display = 'none';
            document.querySelector('#back_to_top').style.display = 'none';
            document.querySelector('ul.heateor_sss_sharing_ul').style.display = 'none';
            document.querySelector('.default_template_holder').style.marginTop = '-30px';
            document.querySelector('.default_template_holder').style.marginBottom = '-50px';
            document.querySelector('#qlwapp').style.display = 'none';
            document.querySelector('div#onesignal-bell-container').style.display = 'none';
        `;
    if (typeof state.params.url !== "undefined") {
      return (
        <View style={{ flex: 1 }}>
          <WebView startInLoadingState source={{ uri: state.params.url }} injectedJavaScript={jsCode}/>

        </View>
      );
    }

    return (
      <View style={{ flex: 1 }}>
        <CustomPage id={state.params.id} />
      </View>
    );
  }
}

谢谢, 薇姬

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。