码迷,mamicode.com
首页 > 其他好文 > 详细

vue使用stylus基本布局

时间:2019-12-27 00:18:55      阅读:71      评论:0      收藏:0      [点我收藏+]

标签:list   vue   back   mode   for   ini   loading   recommend   load   

<template>
  <div class="recommend">
    <!--  -->
    <van-loading v-show="isshow" />
    <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
      <div class="recommend-top">
          <img src="https://img11.360buyimg.com/jdphoto/jfs/t1/31601/22/15554/14040/5cc2a86fEbdb1098b/88174b36f85283b6.png" >
      </div>
      <ul>
        <li v-for="(item,i) in ment" :key="i">
            <img v-lazy="item.extend.appEntryImage"  :key="i" />
            <span>{{item.name.title}}</span> 
        </li>
      </ul>
    </van-list>
  </div>
</template>
<style scoped lang="stylus">
.recommend 
  margin: 0 0.2rem;
  border-radius: 0.5rem;
  background: #F0F2F5;
  img 
    width: 100%;
.van-loading
    width 1rem
    margin .3rem auto
.van-list
    ul
       width 100%
       li
        width 48%
        height 7.8rem
        float left
        margin-left .1rem
        background-color #ffffff
        margin-top .1rem
        img 
            width 100%
        span 
            font-size .4rem
</style>

vue使用stylus基本布局

标签:list   vue   back   mode   for   ini   loading   recommend   load   

原文地址:https://www.cnblogs.com/1609359841qq/p/12105129.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!