我应该在私有组件中包含多少安全逻辑?

时间:2017-04-17 21:23:58

标签: javascript reactjs

在构建了相当多的React组件,添加propTypes,编写测试以及添加偶尔的默认道具之后,我还在质疑安全性是多少。在涉及Flow类型之后,我开始觉得我需要在尝试呈现内容之前添加更多安全检查以确保所有预期数据都存在。

我可以看到额外安全性的一个好处是确保组件始终正确呈现,即使API失败也是如此。另一方面,快速失败可能会更好地处理失败的API。这些组件非常内部,它们的用途非常清晰,易于追踪。

当前组件:

class Example extends Component {
  render() {
    return this.props.items.slice(4)
      .map(item => <div>{item.name}</div>);
  }
}

安全:

class Example extends Component {
  render() {
    return this.props.items &&
      this.props.items.length &&
      this.props.items.length > 3 &&
      this.props.items.slice(4)
        .map(item => <div>{item.name}</div>);
  }
}

这是否过度工程?

1 个答案:

答案 0 :(得分:1)

如果组件接受用户输入,则应验证该输入。由于组件使用不当而导致的故障应该快速失败,以便在开发过程中进行纠正,从而不会遇到生产环境。