我无法访问状态数组的值答案

【问题标题】：I can't access the value of the array in state我无法访问状态数组的值
【发布时间】：2019-06-17 07:15:22
【问题描述】：

问题：我有一个状态。我想达到这个状态的价值。但是数组中的值。

  state = {
    base: [ {tomato: false}, {egg: false} ],
    contents: [
      {mushroom: false},
      {olive: false},
      {greenPepper: false},
      {sausage: false},
      {tomato: false},
      {redPapper: false}
    ]
  };

class Preivew extends React.Component{
  state = {
    base: this.props.contents.base  
  };

  getBase = () => {
    return(
      this.state.base.map( (value) => {
        console.log(value)
      } )
    )
  }
  
  render(){
    return(
      <Wrap>
        <div className={classes.imageBox}>
          <div className={classes.image}>
          {console.log(this.getBase())} 
          </div>
        </div>
      </Wrap>
    )
  } 
};

输出：

{番茄：假}

{蛋：假}

我想在这里达到“假”。因为我要使用“if else”进行检查操作。

【问题讨论】：

这是您的预期输出吗？你想得到什么。
@Kevin.a 我想在这里达到“假”。因为我要用“if else”来做检查操作。

标签： javascript arrays reactjs object ecmascript-6

【解决方案1】：

使用Object.values。

getBase = () => this.state.base.map(value => Object.values(value)[0])

【讨论】：

【解决方案2】：

可以获取Object.values()的第一个元素

getBase = () => {
    return(
      this.state.base.map( (value) => {
        console.log(Object.values(value)[0])
      } )
    )
  }

【讨论】：

【解决方案3】：

this.state.base.map( (value) => {
    Object.keys(value).forEach(key => {
        console.log(value[key])
    })
}

您可以将 Object.keys 与 forEach 结合使用来解决此问题。

【讨论】：

【解决方案4】：

更新此属性

 getBase = (ingredient) => {
        const ingPresent = this.state.base.find(value => value[ingredient] != undefined);
        return ingPresent ? ingPresent[ingredient] : false;
    };

在渲染中

render(){
    {this.getBase('tomato') && (
        <p>Hello tomato present</p>
    )}
}

该函数还处理基本数组不包含该成分的情况

【讨论】：