Question

嗨，我正在寻找动态更改文本的解决方案。我正在编写代码以在屏幕上显示处理结果。

在进行一些谷歌搜索之后，我发现有一个代码可以动态更新文本，如下所示。

但是我想更新文本而没有任何内部事件。我想从课外更改文本。但是我不知道如何实现它，因为我是一名JavaScript和本机反应的初学者。还有其他一些类可以处理某些功能，因此我需要使用屏幕上的另一个组件“结果”类来显示更新的结果。

如何向“结果”类传递“结果”，以及如何动态，自动地更新它？

class Results extends Component {

    constructor() {
        super()
        this.state = {
           log: 'Processing results'
        }
    }

    updateText = (result) => {
        this.setState({log: result})
    }

    render() {
        return (
            <View>
                <Text onPress = {this.updateText}>
                    {this.state.log}
                </Text>
            </View>
        )
    }
}

Answer 1

在我看来，props可以解决您的问题。

基本上，当您尝试呈现Results类时，将值作为prop传递，如下所示：

<Results dynamicText='HI' />

然后，从您的Results类中，通过this.props.dynamicText如下访问此外部值

class Results extends Component {

  render() {
    return (
        <View>
            <Text>
                {this.props.dynamicText}
            </Text>
        </View>
    )
  }
}

Answer 2

除了@Issac回答的内容外，您还可以将当前类连接到Redux并从另一个类中调度操作以强制状态更改。

React Native和ReactJS在类之间如何相互反应的概念不同。大多数其他语言使用基于继承的交互来影响除自身之外的类中的更改。在改变一类的值/状态/变量需要状态改变或道具改变的情况下，React本身是基于组成的。使用Redux给我们的警告是，Redux利用了一个总体商店，在该商店中与其连接的任何组件都可以提取值或调度操作以更改值。

react-native

2 个答案: