Javascript React Native state赢得'；不变

我正在开发我的第一个游戏应用程序

我要做的是将GreenF传递给Green组件

但国家不会改变。我需要在函数play（）中随时更改GreenF

这只是我的代码的开始，所以没有什么是完整的，只是为了您的理解

    import React, {Component} from 'react';
    import {StyleSheet, Text, View,TouchableOpacity, Button} from 'react-native';
    import Green from './components/Green.js'

     constructor (props){
    super(props);
    this.state = {
      greenF: false,
      score: 0,
      seq: [1,2,3,1,4],
      playerSeq: [],
      round: 1,
    }
  }

  play() {
    this.setState({ greenF: true });
  }

  render(){
    return (
      <View>
        <Button 
        title='start' 
        color='black' 
        onPress={this.play}>

        </Button>
        <Green greenFlash={this.state.greenF}> </Green>
      </View>
    );
  }
}

import React，{Component}来自'React'；
从“react native”导入{样式表、文本、视图、TouchableOpacity、按钮}；
从“./components/Green.js”导入绿色
建造师（道具）{
超级（道具）；
此.state={
格林：错，
分数：0，
序号：[1,2,3,1,4]，
playerSeq:[]，
第二轮：1，
}
}
play（）{
this.setState（{greenF:true}）；
}
render（）{
返回(
);
}
}

您可以使用react native community提供的

AsyncStorage

。它是一个持久存储，您可以在其中设置和获取键值存储。 请参阅：

无论哪种方式，您都可以使用redux进行全局状态管理。

首先： 你为什么要寻找一种不用状态的方法？ 状态将是处理此信息的“反应方式”，特别是因为我假设您希望在值更改后重新启动组件

但是，您可以在渲染函数之外，甚至在组件类之外声明变量

当您现在开始学习react native时，可以看看功能组件和react挂钩（例如，状态的useState挂钩），因为这是编写react组件的更现代的方式

当您的状态增长并需要在树中的许多不同组件之间共享时，您可能希望查看react上下文，甚至是redux之类的状态管理库

编辑

我正在为您的组件添加一个功能组件版本，以展示如何使用钩子管理您的状态，对我来说，钩子更容易，因为状态更新要简单得多。注意：功能性仍然只是您的示例所要做的

import React, { useState } from 'react'
import { StyleSheet, Text, View, TouchableOpacity, Button } from 'react-native'
import Green from './components/Green.js'

const App = props => {
    let score // user score
    let seq = [] //order of playing colors
    let playerSeq = [] //order of user pressing the colors
    let round // round number
    let ok //does the user pressed right
    let win
    let compTurn

    const [ greenF, setGreenF ] = useState(false) // [value, setter] = useState(initial)

    const play = () => {
        seq = [ 1, 2, 3, 1, 4 ] //just for test
        compTurn = true
        round = 1
        for (var i = 0; i < round; i++) {
            switch (i) {
                case 1:
                    setGreenF(true) // triggers rerender (after all state changes are done)
                    break
                case 2:
                    //tbchanged
                    break
                case 3:
                    //tbchanged
                    break
                case 4:
                    //tbchanged
                    break
            }
            compTurn = false
        }
    }

    return (
        <View>
            <Button title="start" color="black" onPress={play} />
            <Green greenFlash={greenF}> </Green>
        </View>
    )
}

export default App

import React，{useState}来自“React”
从“react native”导入{样式表、文本、视图、TouchableOpacity、按钮}
从“./components/Green.js”导入绿色
const App=props=>{
让分数//用户分数
让seq=[]//播放颜色的顺序
让playerSeq=[]//用户按颜色的顺序
让我们四舍五入//四舍五入数字
让ok//用户是否按对了
让我们赢
让我们转身
const[greenF，setGreenF]=useState（false）/[value，setter]=useState（初始）
常量播放=（）=>{
seq=[1,2,3,1,4]//仅用于测试
compTurn=true
圆形=1
对于（变量i=0；i

请也发布您的

play（）

函数。提交全部代码。谈论功能，但不要分享功能本身。我们怎么知道你的函数？只是更新了一个代码，对我的问题做了更多的解释，对不起，只是更新了一个代码，对我的问题做了更多的解释。我试图更好地理解范围，并试图避免使用状态，因为它有点复杂，但在这里我改变了它，它不起作用。该应用程序非常小且简单，您更改的代码至少有两个小错误：第一个

this.setState（greenF=true）

应该是

this.setState（{greenF:true}）

第二个使用

引用您当前的状态，而不是仍然存在且未分配的

let greenF您好，我还为您的组件添加了一个功能组件版本，以便您可以比较这两种样式：）谢谢，我不确定什么不起作用，我尝试复制了您的代码，并按照您提到的那样更改了我的代码，但它不起作用。刚刚更新了一个代码，对我的问题进行了更多解释，我现在正在使用状态