React Native 状态在更改值后不更新值答案

【问题标题】：React Native states not updating value after changing valueReact Native 状态在更改值后不更新值
【发布时间】：2020-04-04 00:03:10
【问题描述】：

我是React-Native 及其states 的新手，在这里我遇到了一个问题（使用虚拟数据，但我的问题是一样的）我想要实现的只是从@987654325 获取最新的JSONARRAY @，基于当我单击按钮一时的按钮单击，它应该只返回 [{"one":"oneKey"},{"key":"mutatedFruit"}] 和其他按钮的类似方法以及任何帮助表示赞赏我附上了我的

expo snack code here

【问题讨论】：

标签： ios facebook react-native react-native-android render

【解决方案1】：

编辑：根据您的评论，听起来您的问题是您不希望多次增加相同的价值。在这种情况下，这应该可以解决它：

export default class App extends React.Component {
  state= {
    selectedPosition:0,
  }

  render() {
    const value = data[this.state.selectedPosition].joinedUsers
    value[0]["key"] = "mutatedFruit"

    return ( 
      <View style={styles.container}>
        <Button title='ONE'
        onPress={()=>this.setState({selectedPosition:0})}></Button>
        <Button title='TWO'
        onPress={()=>this.setState({selectedPosition:1})}></Button>
        <Button title='THREE'
        onPress={()=>this.setState({selectedPosition:2})}></Button>
        <Button title='FOUR'
        onPress={()=>this.setState({selectedPosition:3})}></Button>
      <Text>{JSON.stringify(value)}</Text>
      </View>
    );
  }
}

【讨论】：

您好，非常感谢您的回答，但我已经尝试过使用一个函数，它也不能解决问题，而且我在输出中也得到了值，就像我已经按下按钮 1 一样，如果我再次按下按钮 1 它会返回新值和旧值
也许我误解了你的问题是什么？所以你的问题是它每次都添加新值？
编辑了我的答案
再次编辑。我将行更改为 value[0]["key"] = "mutatedFruit"
你认为这段代码会中断吗？，如果我从render()函数中的任何位置更改状态，最后一件事value[0]['key']=''Mutated Fruit"的含义是什么

【解决方案2】：

希望下面的代码有所帮助，

import * as React from 'react';
import { Text, View,Button, StyleSheet } from 'react-native';
import Constants from 'expo-constants';

// You can import from local files
import AssetExample from './components/AssetExample';
 const data = [
   {"joinedUsers":[{"one":"oneKey"}],"key":"mango"}
 ,{"joinedUsers":[{"two":"twoKey"}],"key":"apple"}
 ,{"joinedUsers":[{"three":"threeKey"}],"key":"banana"}
 ,{"joinedUsers":[{"four":"fourKey"}],"key":"kiwi"}];
// or any pure javascript modules available in npm
import { Card } from 'react-native-paper';

export default class App extends React.Component {
  constructor(props){
    super(props);
    this.state={
      selectedPosition:0,
     valueArr : []
    }
  }


  componentDidMount(){
    let newVal = [];
    newVal.push(data[0].joinedUsers[0]) 
    newVal.push({"key":"mutatedFruit"})
    this.setState({valueArr:newVal})

  }


  setValues = (position) => {
      let newVal = [];
       newVal.push(data[position].joinedUsers[0]) 
    newVal.push({"key":"mutatedFruit"})
    this.setState({valueArr:newVal})
  }

  render() {
    const value = data[this.state.selectedPosition].joinedUsers
    value.push({"key":"mutatedFruit"})

    return ( 
      <View style={styles.container}>
        <Button title='ONE'
        onPress={()=>this.setValues(0)}></Button>
        <Button title='TWO'
        onPress={()=>this.setValues(1)}></Button>
        <Button title='THREE'
        onPress={()=>this.setValues(2)}></Button>
        <Button title='FOUR'
        onPress={()=>this.setValues(3)}></Button>
      <Text>{JSON.stringify(this.state.valueArr)}</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    paddingTop: Constants.statusBarHeight,
    backgroundColor: '#ecf0f1',
    padding: 8,
    flexDirection:'column'
  },
  paragraph: {
    margin: 24,
    fontSize: 18,
    fontWeight: 'bold',
    textAlign: 'center',
  },
});

【讨论】：

它实际上解决了我的问题，谢谢。只是好奇我的代码有什么问题？推入数组是保留值还是与先将当前数据保存到状态然后更新它有关？
再次需要帮助请加入我们昨天讨论的聊天室
好的。大约 2 或 3 点我会加入。