componentWillReceiveProps在我的React应用程序中不起作用。显示为未定义

Question

我已经创建了componentWillReceiveProps，但是它按预期工作。

抛出无法读取未定义的属性“ 0”

有没有办法绕过此检查。

MyCode：

componentWillReceiveProps(newProps) {
        console.log(newProps);
        if (typeof newProps.usableShippingAddresses[0] !== undefined && this.state.flag == true ) {
            this.setState({
                selectedAddressId: newProps.usableShippingAddresses[0].addressId
            })
            this.setState({
                flag: false
            })
            this.props.displaySelectedShippingAddress(newProps.usableShippingAddresses[0].addressId);
        }
    }

任何人都可以帮助我对代码进行故障排除。

Answer 1

您正在尝试获取不存在的变量的第一个元素（usableShippingAddresses）。另外，如果未定义事物的typeof，则将其记为'undefined'而不是undefined（作为字符串）。

尝试：

if (typeof newProps.usableShippingAddress !== 'undefined' && newProps.usableShippingAddress.length > 0 && this.state.flag) { // do something with newProps.usableShippingAddress[0] }

typeof newProps.usableShippingAddress !== 'undefined'检查该属性是否存在。

newProps.usableShippingAddress.length > 0检查它是否可迭代且不是空数组。

请注意，您的错误与componentDidReceiveProps生命周期无关-实际上，it will be deprecated at React 17.支持componentDidUpdate。

另一个提示是，避免在彼此后面多做一个setState，在这种情况下，您可以将两个setState合并为一个。