vue使用stylus基本布局
Posted 1609359841qq
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue使用stylus基本布局相关的知识,希望对你有一定的参考价值。
<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基本布局的主要内容,如果未能解决你的问题,请参考以下文章