除了上标和下标文本外，我的应用程序中的所有内容都正确呈现。我尝试使用tagsStyles在<sup>和<sub>标签中应用自定义样式，但我只能更改它们的color或fontsize。我无法让它们模仿上标或下标属性。lineHeight、textAlignVertical、top所有这些似乎都不起作用。我是否使用了这些样式不恰当？有什么变通办法吗？有没有其他的库替代方案来解决这个问题？任何方法都可以。
tagsStyles
<sup>
<sub>
color
fontsize
lineHeight
textAlignVertical
top
5ssjco0h1#
遗憾的是，您正在使用的库可能不支持直接呈现上标和下标文本，或者定制其显示的选项可能有限。一种可能的解决方法是对上标和下标文本使用Unicode字符，而不是HTML标记。例如，可以对上标使用Unicode字符U+207X，对下标使用Unicode字符U+208X。然后，可以使用React Native中的文本组件来显示具有这些Unicode字符的文本，并根据需要应用样式。另一种选择是尝试使用其他库在React Native应用中呈现HTML内容。您可以尝试使用以下库：https://github.com/react-native-webview/react-native-webview
import { WebView } from 'react-native-webview'; .... <WebView originWhitelist={['*']} source={{ html: ` <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <p>Here is some <sup>superscript</sup> text and some <sub>subscript</sub> text</p> </body> </html> ` }} />
1条答案
按热度按时间5ssjco0h1#
遗憾的是，您正在使用的库可能不支持直接呈现上标和下标文本，或者定制其显示的选项可能有限。
一种可能的解决方法是对上标和下标文本使用Unicode字符，而不是HTML标记。例如，可以对上标使用Unicode字符U+207X，对下标使用Unicode字符U+208X。然后，可以使用React Native中的文本组件来显示具有这些Unicode字符的文本，并根据需要应用样式。
另一种选择是尝试使用其他库在React Native应用中呈现HTML内容。您可以尝试使用以下库：https://github.com/react-native-webview/react-native-webview