react组件中的style属性使用css变量时，值会被自动添加上"px"单位，初步排查是@tarojs/react 的setStyle逻辑有问题

[febear]

相关平台

支付宝小程序

小程序基础库: 最新版本
使用框架: React

复现步骤

使用@tarojs/react@3.5.6库， 任意渲染一下<div style={{ lineHeight: 3, '--item-span': 2 }}>，小程序运行时会自动变成'--item-span': 2px

期望结果

组件中的sytle属性的css变量不希望自动添加px

实际结果

组件中的sytle属性的css变量自动添加px

环境信息

👽 Taro v3.5.3


  Taro CLI 3.5.3 environment info:
    System:
      OS: macOS 10.15.7
      Shell: 5.7.1 - /bin/zsh
    Binaries:
      Node: 14.17.3 - /usr/local/bin/node
      Yarn: 1.22.19 - /usr/local/bin/yarn
      npm: 6.14.13 - /usr/local/bin/npm
    npmPackages:
      @tarojs/cli: ^3.4.13 => 3.5.4
      @tarojs/components: ^3.4.13 => 3.5.4
      @tarojs/components-react: ^3.5.5 => 3.5.5
      @tarojs/helper: ^3.4.13 => 3.5.4
      @tarojs/mini-runner: ^3.4.13 => 3.5.4
      @tarojs/plugin-framework-react: ^3.4.13 => 3.5.4
      @tarojs/plugin-html: ^3.4.13 => 3.5.4
      @tarojs/plugin-platform-alipay: ^3.4.13 => 3.5.4
      @tarojs/plugin-platform-jd: ^3.4.13 => 3.5.4
      @tarojs/plugin-platform-qq: ^3.4.13 => 3.5.4
      @tarojs/plugin-platform-swan: ^3.4.13 => 3.5.4
      @tarojs/plugin-platform-tt: ^3.4.13 => 3.5.4
      @tarojs/plugin-platform-weapp: ^3.4.13 => 3.5.4
      @tarojs/react: ^3.4.13 => 3.5.4
      @tarojs/router: ^3.4.13 => 3.5.4
      @tarojs/runtime: ^3.4.13 => 3.5.4
      @tarojs/shared: ^3.4.13 => 3.5.4
      @tarojs/taro: ^3.4.13 => 3.5.4
      @tarojs/taro-h5: ^3.4.13 => 3.5.4
      @tarojs/webpack-runner: ^3.4.13 => 3.5.4
      babel-preset-taro: ^3.4.13 => 3.5.4
      react: ^17.0.0 => 17.0.2

---

补充信息

具体代码位置：

taro/packages/taro-react/src/props.ts

Line 59 in 6add4ff

function setStyle (style: Style, key: string, value: string | number) {

代码思路：
if (key[0] === '-') {
//判断了【-】的前缀时，则自动将value转换成字符串，但下方isNumber使用的不是最新值 style[key]而是传递值value，是否考虑这里直接return回去就好了
style.setProperty(key, value.toString());
}
style[key] =
isNumber(value) && IS_NON_DIMENSIONAL.test(key) === false
? value 'px'
: value == null
? ''
: value;