taro 编译微信小程序时无法正常解析内联样式属性中的冒号

pn9klfpd  于 2022-10-24  发布在  其他
关注(0)|答案(4)|浏览(192)

相关平台

微信小程序

小程序基础库: 2.11.3
使用框架: React

复现步骤

<View
    className="target-card"
    style={`background-image:url('http://cdn.karasu.cn/FqLDIO4r3evaAkpfMDBS8yyi1dTy');`}
/>
.target-card {
    height: 40vw;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
}

期望结果

成功解析内联样式属性:background-image:url(' http://cdn.karasu.cn/FqLDIO4r3evaAkpfMDBS8yyi1dTy ')

实际结果

内联样式属性被解析为:background-image:url('http;

环境信息

Taro CLI 3.0.2 environment info:
    System:
      OS: Windows 10
    Binaries:
      Node: 12.16.2 - C:\Program Files\nodejs\node.EXE
      Yarn: 1.22.4 - ~\AppData\Roaming\npm\yarn.CMD
      npm: 6.14.4 - C:\Program Files\nodejs\npm.CMD

补充信息

内联样式属性中带有冒号":"时无法正常解析后续内容

t5fffqht

t5fffqht1#

@Senkita
应该要改变成react写法了

style={{ backgroundImage: url('http://cdn.karasu.cn/FqLDIO4r3evaAkpfMDBS8yyi1dTy') }}
6qftjkof

6qftjkof2#

@Senkita
应该要改变成react写法了

style={{ backgroundImage: url('http://cdn.karasu.cn/FqLDIO4r3evaAkpfMDBS8yyi1dTy') }}

@flyingalex 改为jsx的写法后冒号解析异常的问题依然存在

fiei3ece

fiei3ece3#

hmm, 那不清楚了,我改后就可以了,
不过新版3.0还是有其他问题,可以再观望哈

ahy6op9u

ahy6op9u4#

同样的问题
taro版本3.0.14

相关问题