uni-app hbuilderx 升级4.0.6后 button出现了边框

uni-app hbuilderx 升级4.0.6后 button出现了边框

<button class=“btn-plate” @click=“onPlateMember”>输入车牌找会员</button>
.btn-plate {
color:white;
background: red;
border-radius: 50rpx;
}

image

相关链接 :


更多关于uni-app hbuilderx 升级4.0.6后 button出现了边框的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

已复现该问题,加分,感谢你的反馈

更多关于uni-app hbuilderx 升级4.0.6后 button出现了边框的实战教程也可以访问 https://www.itying.com/category-93-b0.html


uniapp vue3版本 接入应用内支付服务3.0也是用这个 支付服务3.0吗?

4.07.2024032807-alpha 已修复

在 uni-app 中使用 HBuilderX 升级到 4.0.6 版本后,button 组件出现了边框,这可能是由于样式或框架的更新导致的。以下是一些可能的解决方案:

1. 检查全局样式

可能是全局样式被修改了,导致 button 出现了边框。你可以检查 App.vue 或全局样式文件中是否有针对 button 的样式修改。

你可以在 App.vuestyle 部分添加以下样式来移除边框:

button {
    border: none;
}

2. 检查 button 组件的 border 属性

如果你使用的是 uni-appbutton 组件,检查是否有设置 border 属性。你可以尝试显式地设置 bordernone

<button :border="false">按钮</button>

3. 使用 ::after 伪元素去除边框

如果边框是由伪元素生成的,你可以使用 ::after 伪元素来移除它:

button::after {
    border: none;
}

4. 检查 uni-app 的更新日志

查看 uni-app 的更新日志,看看是否有关于 button 组件的样式更新。如果有,可能需要根据更新日志调整你的代码。

5. 使用自定义样式

如果以上方法无效,你可以尝试使用自定义样式来覆盖默认样式:

.custom-button {
    border: none;
    background-color: transparent; /* 如果需要背景透明 */
}

然后在 button 组件上应用这个样式:

<button class="custom-button">按钮</button>

6. 回滚版本

如果问题确实是由于升级到 4.0.6 版本引起的,并且你无法通过样式调整解决,你可以考虑回滚到之前的版本,等待官方修复。

7. 检查平台差异

如果你只在特定平台(如微信小程序、H5 等)上出现这个问题,可能是平台差异导致的。你可以使用条件编译来针对不同平台设置不同的样式:

/* #ifdef MP-WEIXIN */
button {
    border: none;
}
/* #endif */
回到顶部