我们如何在 TextInput 组件 React Native 中加粗一些单词？

Question

我想要 textInput 中的一些功能，比如如果我们写 hello，那么 hello 应该在 textinput 中加粗，其余的单词将是正常的。有人可以帮我解决吗？

它与下文link.

中提到的Text Component有所不同

Answer 1

您将必须制作自定义 textInput 组件，如下所示：

const [txt,setTxt] = useState("");
        <Pressable>
            <TextInput placeholder="Type Something..." onChangeText={(value)=>setTxt(value)}/>
                <View style={{flexDirection: 'row'}}>
                    {txt.split(" ").map((text)=><Text style={{fontWeight:text == "bold"?'bold':null}}>{text+" "}</Text>)}
                </View>
        </Pressable>

将 text == "bold" 替换为您想要加粗的任何值。

编辑：如果您想将多个单词设为粗体，请将它们分组到一个数组中并像这样更新您的条件：

const anArrayOfBoldStrings = ["bold","hello","Whosebug"];

            <Pressable>
                <TextInput placeholder="Type Something..." onChangeText={(value)=>setTxt(value)}/>
                    <View style={{flexDirection: 'row'}}>
                        {txt.split(" ").map((text)=><Text style={{fontWeight:text == anArrayOfBoldStrings.includes(text?'bold':null}}>{text+" "}</Text>)}
                    </View>
            </Pressable>

我们如何在 TextInput 组件 React Native 中加粗一些单词？

How we can bold some words in TextInput component React Native?

react-native

textinput

react-native-textinput