更改主题标签的文本输入颜色反应原生 mobx

如何解决更改主题标签的文本输入颜色反应原生 mobx

我想在出现主题标签的 textInput 元素中动态更改单词的颜色。类似于许多应用程序。这是我到目前为止所拥有的：

@observable descriptionString: any = '';
@observable formattedText: any = '';

handleCheckTextChange = (inputText:any) => {
    const words = inputText.split(' ');
    console.log(words);
    const formattedText:any = [];
    words.forEach((word:any,index:any) => {
      const isLastWord = index === words.length - 1;
      if (!word.startsWith('@')) {
        return isLastWord ? formattedText.push(word) : formattedText.push(word,' ');
      }
      const mention = (
        <Text key={word + index} style={{color: 'red'}}>
          {word}
        </Text>
      );
      isLastWord ? formattedText.push(mention) : formattedText.push(mention,' ');
    });
    this.formattedText = formattedText;
  }

文本输入：

<TextInput
            maxLength={descriptionMaxLength}
            multiline={true}
            placeholder='Type description here'
            style={styles.descriptionInput}
            returnKeyType='next'
            blurOnSubmit={true}
            onChangeText={(text) => this.handleCheckTextChange(text)}
          >
            <Text>{this.formattedText}</Text>
          </TextInput>

我从另一个堆栈溢出问题中得到了这个，但它似乎不适用于我的代码。收到 mobx 错误，提示“无法冻结动态可观察对象”。我使用 mobx 进行状态处理，错误是 mobx 错误，所以我认为这可能是设置和更改 formattedText observable 的问题。任何帮助表示赞赏！