Question

我正在尝试将react组件的状态设置为与react路由器一起传递的location.state，如果它不存在我想将其设置为0.

但是在某些情况下，检查（currentItem）的属性的父（location.state）不存在，因此以下结果导致无法读取未定义的属性＆＃39;这种情况下的错误

state = {
  currentItem: this.props.location.state.currentItem || 0,
}

我可以使用以下代码避免此错误，但这似乎是一个丑陋的解决方案。

state = {
    currentItem: this.props.location.state
      ? this.props.location.state.currentItem
        ? this.props.location.state.currentItem
        : 0
      : 0
  }

有关如何做得更好的建议吗？

编辑：RobG的评论为我工作，ESLint添加了括号，澄清了正在发生的事情：

state = {
  currentItem: (this.props.location.state && this.props.location.state.currentFear) || 0
}

Answer 1

分配变量看起来更好看。您可以将三元语句更改为＆amp;＆amp;言。

$notes = Note:: orderBy ('id', 'desc') -> get ();
foreach ($notes as $note)
{
    $name = $note->user->name;
}

Answer 2

一种方法是使用这些库，例如lodash / ramda 如，

const _ = require('lodash')
state = {
  currentItem: _.get(this.props.location, 'state.currentItem') || 0,
}

Answer 3

我通常以两种方式之一来做这件事。您可以拉入像lodash这样的库并使用get，也可以编写自己的库。我通常最简单的方法是编写一个reduce函数。

function getProperty(object, key) {
  return key.split('.').reduce((current, memo) => {
    return current ? current[memo] : undefined;
  }, object);
}

const props = {
  location: {
    state: {
      currentItem: 'item'
    }
  }
};


alert(getProperty(props, 'location.state.currentItem'));

避免＆＃39;无法读取未定义的属性＆＃39;尝试检查孙子属性时出错

3 个答案: