zoukankan      html  css  js  c++  java
  • vant Cell单元格 图标放在内容之前

    官网按提供的插槽图片可以放在内容之后,但是我是想放在之前。

    正常情况下,图片永远显示在文字的后面

               <div class="item-box">
                  <van-cell title="银行" :value="checkBank.bankName">
                    <template #right-icon>
                      <img :src="bankBg" class="bank-img"/> 
                    </template>
                  </van-cell>
                  <van-button class="but-copy" size="small"
                    type="info"
                    v-clipboard:copy="bankInfo.bankId"
                    v-clipboard:success="onCopy"
                    v-clipboard:error="onError"
                    >
                    复制
                  </van-button>
                </div>

    为了把图片改到前面,把显示的内容做了一点点调整

               <div class="item-box">
                  <van-cell title="银行">
                    <template #right-icon>
                      <img :src="bankBg" class="bank-img"/>
                      <span class="name">{{ checkBank.bankName }}</span> //把value的内容放到图片之后
                    </template>
                  </van-cell>
                  <van-button class="but-copy" size="small"
                    type="info"
                    v-clipboard:copy="bankInfo.bankId"
                    v-clipboard:success="onCopy"
                    v-clipboard:error="onError"
                    >
                    复制
                  </van-button>
                </div>

     得到如下效果

     一点点小小的调整,记录下来。

  • 相关阅读:
    java中awt和swing是的关系以及区别
    java 5.0和java6.0的区别
    bpel 经典实例入门教程
    java中指针的问题
    linux下软件的基本安装和卸载
    stomp与veil用法
    in perspective用法
    不錯的句子
    fit into用法
    ceremony用法
  • 原文地址:https://www.cnblogs.com/tanweiwei/p/14541968.html
Copyright © 2011-2022 走看看