1.使用扩展插件uni-popup弹出层,引入写入index.vue中<uni-popup ref="usePopup" type="center" @maskClick="closeUsePopup">// 建立弹出事件 <view class="usePopup"> <image src="../../static/images/upward.png" mode="heightFix" @click="closeUsePopup"></image> </view> 2.写入弹出层的css样式usePopup{ padding-top: 15vh; image{ height: 150rpx; transform: translateY(100rpx); //位移 opacity: 0; //透
1.swiper轮播,进度条的进度控制 <view class="progress"> <view class="line" :style="{width:lineWidth+'%'}"></view> </view> 样式的宽度也就是进度改为变量控制<swiper vertical @change="swiperChange"> <swiper-item v-for="(item,index) in listData" :key="index"> 在轮播器上加入change事件,和listData的变量,来获取控制轮播器当前页面的参数<script setup> import { computed, ref } from 'vue'; const listData = ref([1,2,3,4,5]); const curren
1.安装官方的扩展组件uni-icons图标2.在index.vue的info中加入内容,以下代码,加入1中的图标 <view class="left"> <view class="item"> <uni-icons type="redo" size="28" color="#999"></uni-icons> <text></text> </view> </view> <view class="right&
1.在index.vue里面增加main的样式.main{ font-size: 50rpx; font-weight: lighter; width: 100%; letter-spacing: 0.05em; //当前字的间距,其中em是字体大小的倍数 line-height: 1.8em;//行间距 margin-top: 10rpx; //元素的顶部外边距外边距区域 margin-bottom: 60rpx;//元素的底部外边距外边距区域 } 2.在index.vue中修改auther的样式.author{ .line{
1.修改index.vue的body样式,写入overflow: hidden;溢出隐藏,使绿色部分也能变成圆角,并删除绿色背景,重新配置swiper-item2、构建主体首页布局<template> <view class="homeLayout"> <view class="head"> <home-head> </home-head> </view> <view class="body"> <view class="swiperOut"> <swiper vertical> <swiper-item v-for="(item,index) in 5"> <view class="
ikrins