在微信小程序的webview模式下label与span表现一致 但是在微信的Skyline渲染引擎下 label 与span的表现不一致 导致每次编译到微信小程序后 需要手动将编译后的文件中的label更改为span才能在Skyline中得到正确的表现。
用户2860107
- 发布：2025-07-23 15:02
- 更新：2025-07-24 10:57
- 阅读：342
用户2860107 (作者)
编译前：
<template>
<span>
<template v-for="(item,index) in tokens" :key="index">
<text v-if="isText(item.type)">{{item.text}}</text>
<text class="bold" v-else-if="isStrong(item.type)" v-for="(item,index) in item.tokens" :key="index">
<text v-if="isText(item.type)">{{item.text}}</text>
<text class="underline" v-else-if="isLink(item.type)" @click.stop="()=>{link(item.href)}">{{item.text}}
</text>
</text>
<text class="italic" v-else-if="isEm(item.type)" v-for="(item,index) in item.tokens" :key="index">
<text v-if="isText(item.type)">{{item.text}}</text>
<text class="bold" v-else-if="isStrong(item.type)" v-for="(item,index) in item.tokens" :key="index">
<text v-if="isText(item.type)">{{item.text}}</text>
<text class="underline" v-else-if="isLink(item.type)"
@click.stop="()=>{link(item.href)}">{{item.text}}
</text>
</text>
</text>
<text class="underline" v-else-if="isLink(item.type)"
@click.stop="()=>{link(item.href)}">{{item.text}}</text>
<text class="codespan" v-else-if="isCodespan(item.type)">{{item.text}}</text>
<text class="del" v-else-if="isDel(item.type)">{{item.text}}</text>
<image v-else-if="isImage(item.type)" :src="item.href" mode="widthFix" style="width: 80%;" @click="()=>{imgPreview(item.href)}"></image>
</template>
</span> </template>
编译到维修后
<label><block wx:for="{{a}}" wx:for-item="item" wx:key="q"><text wx:if="{{item.a}}">{{item.b}}</text><block wx:elif="{{item.c}}"><text wx:for="{{item.d}}" wx:for-item="item" wx:key="f" class="bold"><text wx:if="{{item.a}}">{{item.b}}</text><text wx:elif="{{item.c}}" class="underline" catchtap="{{item.e}}">{{item.d}}</text></text></block><block wx:elif="{{item.e}}"><text wx:for="{{item.f}}" wx:for-item="item" wx:key="e" class="italic"><text wx:if="{{item.a}}">{{item.b}}</text><block wx:elif="{{item.c}}"><text wx:for="{{item.d}}" wx:for-item="item" wx:key="f" class="bold"><text wx:if="{{item.a}}">{{item.b}}</text><text wx:elif="{{item.c}}" class="underline" catchtap="{{item.e}}">{{item.d}}</text></text></block></text></block><text wx:elif="{{item.g}}" class="underline" catchtap="{{item.i}}">{{item.h}}</text><text wx:elif="{{item.j}}" class="codespan">{{item.k}}</text><text wx:elif="{{item.l}}" class="del">{{item.m}}</text><image wx:elif="{{item.n}}" src="{{item.o}}" mode="widthFix" style="width:80%" bindtap="{{item.p}}"></image></block></label>
-
ok，就是你在skyline模式下，span标签是原生组件，但是被编译为label标签。官方计划在 manifest.json 中添加一个nativeTags 的配置项，里面包含的组件不会被编译转化，你可以把原生组件放在这里。发版之后我会在这里回复。
2025-07-24 11:07
-
用户2860107 (作者)
回复 DCloud_UNI_JBB: 配置是否只对skyline页面生效？ 因为我webview渲染引擎下也需要使用span 这时应该转化为label
2025-07-24 11:47
-
-
用户2860107 (作者)
回复 DCloud_UNI_JBB: 不能增加一个生效页面之类的东西吗 让开发者自行指定 不然的话 封装的很多组件不能在skyline 、webview下通用
2025-07-24 11:57
-
-
回复 用户2860107: 你写原生微信小程序，webview模式下要写label，skyline模式下要写span，不一样没办法兼容两种模式吗？
2025-07-24 12:02
-
回复 用户2860107: 不是配置的问题，这个只能解决你是单个页面走某种模式；依然解决不了一个页面即可能走webview，也可能走skyline这种情况
2025-07-24 12:05
-
-
-
用户2860107 (作者)
好的
2025-07-23 15:16
DCloud_UNI_JBB
回复 用户2860107: 评论区发下有问题的代码和对应的编译产物
2025-07-23 15:18
用户2860107 (作者)
回复 DCloud_UNI_JBB: 已发
2025-07-24 11:05