需求:根据排名修改其背景色
- 找到组件dv-scroll-ranking-board下载后的文件位置将其复制到你需要的文件位置
- 修改组件中引入的方法路径
修改为
import autoResize from "@jiaminghi/data-view/lib/mixin/autoResize";
- 修改样式
<div class="ranking-column">
<div
class="inside-column"
:style="`width: ${item.percent}%;background: ${bgColor(
item.ranking
)}`"
>
<div class="shine" />
</div>
</div>
bgColor(value) {
let style =
"linear-gradient(to right,rgba(0, 180, 255, 0),rgba(0, 180, 255, 1))";
if (value == 1) {
style =
"linear-gradient(to right,rgba(251, 37, 93, 0),rgba(251, 37, 93, 1))";
} else if (value == 2) {
style =
"linear-gradient(to right,rgba(221, 104, 41, 0),rgba(221, 104, 41, 1))";
} else if (value == 3) {
style =
"linear-gradient(to right,rgba(255, 246, 1, 0),rgba(255, 246, 1, 1))";
}
return style;
},