我正处于React应用程序开发的中间,这是我用于组件的方法:我使用PropTypes验证验证我希望收到的道具,但我仍然分配默认值以避免它如果收到的数据出现问题,则会中断.

最近我被告知我们不应该这样做,道具是我们对父母的期望,如果合同没有得到尊重让组件破裂.

哪种方法是正确的,有哪些优点和缺点？

我的一些考虑因素值得深思.

在我的初始方法之后,在测试中,我明确地测试了传递给测试组件的默认值,一些无效数据并期望仍然打印出有效的快照.由于一些不良数据,测试不会失败,但是我打印出PropTypes验证警告(如果需要,可能会转换为错误 - 我认为 - 或者在测试中嘲笑它们).

测试和实际应用程序中的这些警告比仅仅看到"无法读取'someProp'未定义"或类似的错误(以及让React渲染循环中断)更简洁明了.propType验证直接并清楚地告诉你你做错了什么(你传给了错误的类型作为道具,道具完全缺失等等).

使用第二种方法,测试失败,因为应用程序中断.我认为只有当测试覆盖率真的很好(90/100%)时这才是一个很好的方法,否则这是一个风险 - 它可以上线并打破破坏产品声誉的边缘情况.重构或需求变更经常发生,并且一些边缘情况可能最终导致破坏应用程序的不需要的数据,并且未在自动或手动测试中捕获.

这意味着当应用程序处于活动状态时,由于某些不良数据而整个应用程序停止工作,代码可能会破坏父组件,而在第一种情况下,应用程序具有弹性并且只能以受控方式显示一些空字段.

思考？

遵循一个简化的例子:

反应组件

import React from 'react';
import PropTypes from 'prop-types';
import styles from './styles.css';

export const App = ({ person : { name, surname, address, subscription } = {} }) => (
  <div style={styles.person}>
    <p> {person.name} </p>
    <p> {person.surname} </p>
    <p> {person.address} </p>
    <div>
    {
      person.subscription &&
       <Subscription details={person.subscription} />
    }
    </div>
  </div>
);

// PS. this is incorrect in this example (as pointed out …

Angular有一个很好的$ exceptionHandler.react.js有这样的东西吗？

我想将我的错误记录到外部API.例子:

• https://github.com/occ/TraceKit
• http://trackjs.com/
• https://plus.google.com/+PaulIrish/posts/12BVL5exFJn