小程序条件渲染
view.course-collection(@tap="jumpSecondaryPage('myCourses')")
view.content.content_01(wx:if="{{!isLogin}}")
image.img_01(src="../asserts/images/icon_bag_medium@2x.png")
view.course-title 超值课包
view.detail 提前看课表,免支付流程
image.img_02(src="../asserts/images/Rectangle3@2x.png")
view.content.content_02(wx:else)
view.progress-num.inline-block {{consume}}/{{total}}
view.progress-detail.inline-block.remaining(wx:if="{{remaining == 0}}") 课包已用光
view.progress-detail.inline-block(wx:elif="{{ remaining >= 3}}") 已消耗课包
view.progress-detail.inline-block.remaining(wx:else) 课包仅剩{{remaining}}次
view.supplementary-wrap.inline-block
image.supplementary-logo(src="../asserts/images/icon_bag_small@2x.png")
view.supplementary.inline-block 补充课包
image.goto(src="../asserts/images/Rectangle4@2x.png")
view.progress-bar.gray-bar
view.progress-bar.color-bar(style="width:{{(consume / total) * 100}}%;")
// vue渲染
// .progress-bar.color-bar(:style="{width: consume / total * 100 + '%'}")
本文标题:小程序条件渲染
本文链接:https://www.haomeiwen.com/subject/rtvpiftx.html
网友评论