Javascript 反应+；重新加载道具未及时加载

我试图根据从Redux接收并传递给我的组件道具的数据来切换类名值。但是，使用此代码，我刚刚收到以下错误：

Uncaught TypeError: Cannot read property '0' of null

在我看来，道具还没有收到。我听说过使用默认/回退道具，但没有成功地实现它们

我该如何解决这个问题

calcROI() {
    const myNum = (this.props.value1[0] + this.props.value2[0]);

    let spanClassname = '';

    if(myNum < 0) {
        spanClassname = 'my-class';
    }

    const myNewNum = myNum.toFixed(0);

    return {
        spanClassname,
        value : myNewNum
    }
}

render() {
    const {value3} = this.props;
    const {spanClassname, value} = this.calcROI();

    return (
        <span className={spanClassname}>
            My value is: {value + value3}
        </span>
    );

}

calcROI（）{
const myNum=（this.props.value1[0]+this.props.value2[0]）；
让spanClassname=''；
if（myNum<0）{
spanClassname='我的班级'；
}
const myNewNum=myNum.toFixed（0）；
返回{
spanClassname，
值：myNewNum
}
}
render（）{
const{value3}=this.props；
const{spanClassname，value}=this.calcROI（）；
返回(
我的值是：{value+value3}
);
}

一种解决方案是使用默认值，在本例中为0，在声明myNum时添加一些额外条件：

//检查this.props.value1和value2是否存在，以及它们的长度是否大于1
常量isMyNumExists=（this.props.value1&&this.props.value1.length>1）
&&（this.props.value2&&this.props.value2.length>1）；
//如果isMyNumExists为false或props未定义，请将myNum设置为0
const myNum=this.props&&isMyNumExists？
（this.props.value1[0]+this.props.value2[0]）：0您想如何修复它？你想改用默认值/回退值吗？谢谢，这真是太棒了，现在我知道怎么做了。你知道这个吗？正在为组件设置默认道具。。。如果我收到Redux的道具，这可能行不通？非常好奇..@fromspace更新了我的答案