j***@yeah.net

发布：2022-03-04 17:21
更新：2022-10-05 12:43
阅读：873

【报Bug】VUE3。H5 端中 navigator 组件编译后，该组件的scoped_id与父元素不一致。导致给该组件配置的样式不生效。

分类：uni-app

bug已修复

产品分类： uniapp/H5

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： 10

HBuilderX类型：正式

HBuilderX版本号： 3.3.9

浏览器平台： Chrome

浏览器版本： 98.0.4758.102

项目创建方式： HBuilderX

操作步骤：

在组件中使用view标签包裹navigator标签，加上类名，并配上样式。

<template>  
    <view class="view1">  
        <navigator class="nav1">Text Label</navigator>  
    </view>  
</template>  
<style lang="scss" scoped>  
.view1{  
    display:block;  
    .nav1{  
        color:red;  
    }  
}  
</style>

预期结果：

view.view1中的navigator.nav1的样式应受到控制，显示为红色。

实际结果：

view.view1中的navigator.nav1的样式应并无受到控制，为默认样式。

bug描述：

最近从HBuilderX 3.3.5升级至3.3.9版本开发基于VUE3项目。调试H5端时发现 navigator 组件的编译结果与早前版本有区别。
留意到在编译后的 <uni-navigator/>标签外，还包裹着 <a class="navigator-wrap"/>标签。

但是，发现这个版本中。 <a class="navigator-wrap"/>标签和包裹在里面的 <uni-navigator/>标签的scoped_id（data-v-*****的属性）并不一致。导致编写的样式无法应用到 <uni-navigator/>标签中。

2022-03-04 17:21 负责人:无分享

4 个回复

小枫叶 - 外包接单加v:wlmk1234567 注明来意

老哥,我能说你的class那边多了两个引号么

j***@yeah.net (作者)

多谢您的指正，已改正。但这不是导致问题的原因所在。

2022-03-07 08:41

j***@yeah.net (作者)

是否有大神帮忙跟进这个问题？还是各位有更好的解决方法？请指教

DCloud_UNI_LXH

已确认bug，预计下版修复

2022-03-07 10:30

DCloud_UNI_GSQ

HBuilderX alpha 3.4.1+ 已修复

j***@yeah.net (作者)

感谢，辛苦了

2022-03-09 10:12
g***@qq.com

vue3中使用 navigator 会多包一层 navigator-wrap

2022-04-12 16:17
g***@qq.com

回复 j***@yeah.net: <a class="navigator-wrap" href="/pages/index/index" data-v-1badc801=""><uni-navigator class="entry-item" data-v-1badc801=""></uni-navigator></a>

2022-04-12 16:18
g***@qq.com

"@dcloudio/uni-app": "^3.0.0-alpha-3040520220408002",

2022-04-12 16:18

3***@qq.com

为什么我的3.6.4版本还存在这个问题？

该问题目前已经被锁定, 无法添加新回复

【报Bug】VUE3。H5 端中 navigator 组件编译后，该组件的scoped_id与父元素不一致。导致给该组件配置的样式不生效。

操作步骤：

在组件中使用view标签包裹navigator标签，加上类名，并配上样式。

`<template> <view class="view1"> <navigator class="nav1">Text Label</navigator> </view> </template> <style lang="scss" scoped> .view1{ display:block; .nav1{ color:red; } } </style>`

预期结果：

view.view1中的navigator.nav1的样式应受到控制，显示为红色。

实际结果：

view.view1中的navigator.nav1的样式应并无受到控制，为默认样式。

bug描述：

4 个回复

公告

相关问题

【报Bug】VUE3。H5 端中 navigator 组件编译后，该组件的scoped_id与父元素不一致。导致给该组件配置的样式不生效。

操作步骤： 在组件中使用view标签包裹navigator标签，加上类名，并配上样式。 <template> <view class="view1"> <navigator class="nav1">Text Label</navigator> </view> </template> <style lang="scss" scoped> .view1{ display:block; .nav1{ color:red; } } </style>

预期结果： view.view1中的navigator.nav1的样式应受到控制，显示为红色。

实际结果： view.view1中的navigator.nav1的样式应并无受到控制，为默认样式。

bug描述：

与内容相关的链接

4 个回复

公告

相关问题

操作步骤：

在组件中使用view标签包裹navigator标签，加上类名，并配上样式。

`<template> <view class="view1"> <navigator class="nav1">Text Label</navigator> </view> </template> <style lang="scss" scoped> .view1{ display:block; .nav1{ color:red; } } </style>`

预期结果：

view.view1中的navigator.nav1的样式应受到控制，显示为红色。

实际结果：

view.view1中的navigator.nav1的样式应并无受到控制，为默认样式。