Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/react-native/7.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/svg/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
React native 位置：修复了React native Webview在iOS和Android上的行为不一致_React Native_Svg_React Native Ios_React Native Webview - Fatal编程技术网
Fatal编程技术网
  • react-native/
  • React native 位置：修复了React native Webview在iOS和Android上的行为不一致

React native 位置：修复了React native Webview在iOS和Android上的行为不一致

react-native svg

React native 位置：修复了React native Webview在iOS和Android上的行为不一致,react-native,svg,react-native-ios,react-native-webview,React Native,Svg,React Native Ios,React Native Webview,我正在尝试使用Webview显示代码生成的SVG。以下组件在Android上的行为与我所需的一样，但svg在iOS上不适合webview/ import * as React from "react"; import { View } from "react-native"; import WebView from "react-native-webview"; function TestComp() { return ( <View style={{ flex

我正在尝试使用Webview显示代码生成的SVG。以下组件在Android上的行为与我所需的一样，但svg在iOS上不适合webview/

import * as React from "react";
import { View } from "react-native";
import WebView from "react-native-webview";


function TestComp() {
    return (
        <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
            <View style={{ height: 100, width: 100 }}>
                <WebView source={{ html }}/>
            </View>
        </View>
    );
}

export default TestComp;


const html = `<html>
<head>
  <style>
    html, body { background-color: blue; }
    svg {
      position: fixed;
      height: 100%;
      width: 100%;
    }
  </style>
</head>

<body>
    <svg viewBox="0 0 75 135">
        <circle cx="38.2" cy="25.7" r="25.7"/>
        <path d="M56.5,134h-38c-10.1,0-18.3-8.2-18.3-18.3v-38c0-10.1,8.2-18.3,18.3-18.3h38 c10.1,0,18.3,8.2,18.3,18.3v38C74.8,125.8,66.6,134,56.5,134z"/>
    </svg>
</body>
</html>`;

import*as React from“React”；
从“react native”导入{View}；
从“react native WebView”导入WebView；
函数TestComp（）{
返回(
);
}
导出默认TestComp；
常量html=`
html，正文{背景色：蓝色；}
svg{
位置：固定；
身高：100%；
宽度：100%；
}
`;
Android（正确结果）：

iOS，剪辑后的：

我认为iOS没有像android那样处理
位置：固定的
。。。但我不知道为什么以及如何修复它。有解决方案吗？
我通过在html中添加
部分修复了它