关于引入自定义组件后和本页面progress 的color属性冲突问题
发布于 6 年前 作者 juanye 11534 次浏览 来自 问答

正常页面是这样的 我在data里面给每一个progress组件的color设置了一个属性 再引入自定义组件(一个遮罩层)之前是正常的

此时这个页面的json是{}。

但是如上两个图片显示的 当我使用

“usingComponents”: {

}

的时候 即使里面什么组建都还没有引入 progress的color属性也已经失效了

基础库版本 1.6.4 到1.7.0 都测试了

3 回复

你好,麻烦提供一下这个区域的 WXML 代码,以及对应的 WXSS 代码,以便我们排查问题。

感谢反馈。这个问题是由于 color 属性被废弃导致的,请使用 active-color 属性代替。

另外,请尽量避免 hacking 内置类。你的情况比较适合自行实现一个进度条。

好的

<view class=‘fullX line flexC’ wx:for="{{percent}}">

<view class=‘play’>{{item.grade}} : </view>

<progress backgroundColor=“rgba(0,0,0,0)” percent=“100” style=“width:{{item.width}}rpx” color=’{{item.color}}’ stroke-width=“12” active />

</view>

.wx-progress-bar {

display: inline-block;

border-radius: 10rpx;

}

.wx-progress-inner-bar {

background-size: 9px 9px;

background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));

border-radius: 10rpx;

}

progress {

width: 300rpx;

margin: 8rpx 20rpx 0 20rpx;

}

percent: [

    { width: 100, people: 0, grade: “初级”, color: “#f26420” },

    { width: 100, people: 0, grade: “二级”, color: “#ef2e35” },

    { width: 100, people: 0, grade: “三级”, color: “#fbba1b” },

    { width: 100, people: 0, grade: “四级”, color: “#4f308d” },

    { width: 100, people: 0, grade: “高级”, color: “#f86b2e” }

]

回到顶部