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>

 

 得到如下效果

 

 一點點小小的調整,記錄下來。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM