React Native：一句话中的多种字体答案

【问题标题】：React Native: Multiple fonts in one sentenceReact Native：一句话中的多种字体
【发布时间】：2020-03-22 15:30:55
【问题描述】：

我需要在 React Native 上用英语和我的当地语言写成一句话。

我看过很多帖子，但似乎没有运气。

我写这篇文章是为了得到一些答案，或者可能是一些解决这个问题的建议。

我正在寻找的示例是：

你好ពិភពលោក

我想Hello 用于字体，ពិភពលោក 用于字体。附言文字来自 DB。

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

class Setting extends React.Component {
    render() {
        return (
            <>
                <Text style={ styles.customFont }>Hello ពិភពលោក</Text>
            </>
        )
    }
}

const styles = StyleSheet.create({
   customFont: {
      //// I want to have fallback font for English words (Aller Font, etc.)
      fontFamily: Platform.OS === 'ios' ? 'Siemreap' : 'Siemreap-Regular'
   }
});

export default Setting;

【问题讨论】：

您能告诉我们您目前拥有的代码吗？这样更容易提供帮助，谢谢！
react-native 支持嵌套文本 - reactnative.dev/docs/text#nested-text
@SDushan 如果我有静态文本，这样做很好。但这不是动态文本的好主意，否则我需要遍历文本并将英文替换为嵌套文本。
这个问题你解决了吗？
@AungMyintThein 不，这里的后备字体似乎是不可能的。

标签： reactjs react-native native

【解决方案1】：

在 React Native 中

Text 支持嵌套、样式和触摸处理。

所以，如果我理解了你的问题，你正在寻找这样的东西：

export default class Test extends React.Component {
  render() {
    return (
      <>
        <Text>
          <Text style={styles.hello}>Hello </Text>
          <Text style={styles.name}>Michael</Text>
        </Text>
      </>
    );
  }
}

const styles = StyleSheet.create({
  hello: {
    fontFamily: 'Mishafi',
  },
  name: {
    fontFamily: 'Optima'
  },
});

只需将字体样式替换为适合您的情况即可。告诉我。

【讨论】：

包装所有内容的片段应该不是必需的。
@BenjaminGodlove 你是对的。从源头复制粘贴，没注意
如果是静态的，那没关系。但是，我想做的是动态文本，我真的不想遍历每个单词并用嵌套文本替换。
所以你真正的问题是识别哪些文本部分需要交替显示。我现在是吗？我可以建议您改进您的帖子以使其更易于理解吗？
@BenjaminGodlove 您实际上希望它们像这样包装，这样您就可以使用多行文本获得正确的自动换行。如果它们没有嵌套在单个 Text 元素下，它们的多行将从各自 Text 元素的开头开始。