withWeapp syncKeys异常

[hpsoar]

相关平台

微信小程序

复现仓库

https://github.com/hpsoar/taro_syncKeys_exception.git
小程序基础库: 2.10.4
使用框架: React

复现步骤

git clone https://github.com/hpsoar/taro_syncKeys_exception.git

npm install

yarn dev:h5

点击「Update Value」按钮

期望结果

无异常，正常展示页面

实际结果

抛异常：
TypeError
Cannot assign to read only property 'url' of object '#'

环境信息

👽 Taro v3.6.29


  Taro CLI 3.6.29 environment info:
    System:
      OS: macOS 14.5
      Shell: 5.9 - /bin/zsh
    Binaries:
      Node: 20.5.0 - ~/.nvm/versions/node/v20.5.0/bin/node
      Yarn: 1.22.10 - /usr/local/bin/yarn
      npm: 9.8.0 - ~/.nvm/versions/node/v20.5.0/bin/npm
    npmPackages:
      @tarojs/cli: 3.6.29 => 3.6.29
      @tarojs/components: 3.6.29 => 3.6.29
      @tarojs/helper: 3.6.29 => 3.6.29
      @tarojs/plugin-framework-react: 3.6.29 => 3.6.29
      @tarojs/plugin-platform-alipay: 3.6.29 => 3.6.29
      @tarojs/plugin-platform-h5: 3.6.29 => 3.6.29
      @tarojs/plugin-platform-jd: 3.6.29 => 3.6.29
      @tarojs/plugin-platform-qq: 3.6.29 => 3.6.29
      @tarojs/plugin-platform-swan: 3.6.29 => 3.6.29
      @tarojs/plugin-platform-tt: 3.6.29 => 3.6.29
      @tarojs/plugin-platform-weapp: 3.6.29 => 3.6.29
      @tarojs/react: 3.6.29 => 3.6.29
      @tarojs/runtime: 3.6.29 => 3.6.29
      @tarojs/shared: 3.6.29 => 3.6.29
      @tarojs/taro: 3.6.29 => 3.6.29
      @tarojs/taro-loader: 3.6.29 => 3.6.29
      @tarojs/webpack5-runner: 3.6.29 => 3.6.29
      @tarojs/with-weapp: ^3.6.30 => 3.6.30
      babel-preset-taro: 3.6.29 => 3.6.29
      eslint-config-taro: 3.6.29 => 3.6.29
      react: ^18.0.0 => 18.3.1
    npmGlobalPackages:
      typescript: 5.4.5

---

补充信息

为什么遇到这个问题：

小程序 转 taro后，尝试yarn dev:h5看看效果。

异常原因：

image_mask组件使用了@withWeapp(cacheOptions.getOptionsFromCache())

点击Update Value，触发image_mask组件以下逻辑：

componentWillReceiveProps -> triggerObservers -> diff -> syncKeys

其中对值为undefined的property赋值null。而react组件的props，其property是只读的。