gpt4 book ai didi

reactjs - JSX 文件中的 " "在某些浏览器中被转换为 "Â"

转载 作者:行者123 更新时间:2023-12-03 14:13:39 25 4
gpt4 key购买 nike

大概与 UTF8 转换有关,但我不知道转换发生在哪里或为何发生,也不知道如何禁用它:如果我有一个在文本中包含“ ”的 JSX 文件XML 节点,那么当该节点在某些浏览器中呈现时,结果是“”,而不是所需的不间断空格。

研究表明,造成这种情况的直接原因是 unicode 不间断空格字符、U+00A0(而不是我尝试使用的实体),被转换为 UTF-8 并给出结果字节序列 0xC2 0x00,然后被解释为 ISO-8859-1。我想做的就是阻止这种翻译的发生。

这似乎根本不会发生在桌面浏览器中,但我正在开发的应用程序是 Apache Cordova 应用程序,当该应用程序安装在移动设备上时就会出现问题,因此要么是移动浏览器本身,使用 WebView 而不是独立浏览器的某些方面,或者导致它的 Cordova 编译过程的一部分。

我的构建过程还使用了 webpack 和 babel,但我似乎没有任何可能与此相关的与字符集处理相关的设置。

显示错误的示例代码:

function startApp () {
ReactDOM.render (<span>&nbsp;</span>, document.getElementById('app'));
}
if (typeof document !== "undefined") document.addEventListener ("deviceready", startApp, false);

HTML 文件:

<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Security-Policy" content="
default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval' http://www.randomtext.me;
script-src 'self' data: gap: 'unsafe-inline' 'unsafe-eval' connect.facebook.net;
style-src 'self' 'unsafe-inline';
media-src *;
img-src *;
frame-src 'self' gap: *.facebook.com;
connect-src * data:;">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<title>Hello World</title>
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/swiper.min.css">
<style type="text/css">
@font-face {
font-family: "OpenSans-Regular";
src: url("fonts/OpenSans-Regular.ttf") format("truetype");
}
@font-face {
font-family: "OpenSans-Italic";
src: url("fonts/OpenSans-Italic.ttf") format("truetype");
}
@font-face {
font-family: "OpenSansCondensed-Light";
src: url("fonts/OpenSansCondensed-Light.ttf") format("truetype");
}
@font-face {
font-family: "OstrichSans-Medium";
src: url("fonts/OstrichSans-Medium.otf") format("truetype");
}
</style>
</head>

<body><div class="Fill" id="app"></div></body>

<script type="text/javascript" src="js/styles.js"></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/app.js"></script>

</html>

更新

我发现了this blog post其他人也经历过这种情况。建议的解决方案是使用:

<meta charset="utf-8">

在index.html中。这可以解决我所描述的问题,但我也对一种不会阻止渲染使用 ISO-8859-1 作为编码的现有文档的解决方案感兴趣。

最佳答案

我也遇到了这个条目的问题。

检查这个问题:&nbsp jsx not working .

您可以使用dangerouslySetInnerHTML

<div dangerouslySetInnerHTML={{__html: 'Select Scenario: &nbsp;'}} />

或者

<h1>Code {' '}</h1>

关于reactjs - JSX 文件中的 "&nbsp;"在某些浏览器中被转换为 "Â",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46035896/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com