Question

我有一个组件，该组件使用s3存储桶的图像ID渲染一些值。已创建一个子组件，该子组件将调用AWS服务器并获取图像URL。设置加载程序，直到进行API调用为止。从呼叫中收到URL后，加载程序将停止并显示图像。

问题：我对要执行的值有一些操作。例如保持值，增加或减少。

在更新状态时，将重新安装组件。然后将再次调用并加载图片API。

shouldComponentUpdate不起作用。因为如果我使用它，它将不会在屏幕上显示更改。

已设置加载器，直到加载图像。但在每次单击按钮时都显示加载程序是无效的。寻找更好的解决方案。从过去的12个小时开始就一直停留在该问题上。如果有人可以帮助我摆脱这个问题，我将非常感激。

谢谢。

Answer 1

我认为问题出在componentWillReceiveProps内的<LoadImage />方法中

componentWillReceiveProps(nextProps){
        if (this.props !== nextProps) {
            this.setState({
                image:DefaultImage,
                loading:true
            })
            this._loadImages(nextProps)
        }else{
            this.setState({
                loading: false,
            })
        }
    }

您正在呼叫this._loadImages(nextProps)，当道具从所有者组件传递到this.props !== nextProps时可以被反复调用。

即使您对传入的道具进行比较，componentWillReceiveProps也将始终为真，因为它们都是对象。您可以看到一些questions on this。

如果这是您想要的方式，那么您最好对所关心的特定道具进行比较。

也要注意 getDerivedStateFromProps已过时，您应该查看update apiusers set balance = balance - ? -- how much to change the balance where userid = ?; -- which user to change it for。 View the docs here。

不要重新安装组件，而要更改值

1 个答案: