![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
uni-app
YoloAva
这个作者很懒,什么都没留下…
展开
-
Uni-app 详情页 播放视频功能
逻辑:1.课程详情页加载后,用token判断用户是否登录,登录状态则调用//查询课程是够有播放的权限的接口(只传入courseId),后端会返回hasAuth为true/false2.点击某一章节时,登录状态则调用//查询课程是够有播放的权限的接口(这次要传入courseId & chapterId),后端会返回hasAuth为true/false和videoId,如果这俩都有,则跳页面到视频播放页3.跳转到视频播放页,请求课程详情接口、视频播放接口(传入courseId & c原创 2022-01-12 19:31:16 · 5009 阅读 · 3 评论 -
Uni-app 订单页 下拉加载更多
订单页面 下拉加载逻辑:1.给每个Tab绑定滑动触底事件reachBottom(currentIndex),传入了currentIndex。在函数内判断:为哪个index,并且对应数组比如orderTotal > this.orderList.length,这就说明可以加载更多,就==》pageNum++;并调用查询订单的接口this.__init()。2.接口返回200后有个判断:若pageNum=1,将请求到的list直接赋值;若pageNum>1,就用p...原创 2022-01-11 19:46:00 · 1616 阅读 · 0 评论 -
Uni-app 结算页 支付逻辑
场景:在购物车页面,用户选中了商品,点击结算,则跳转到结算页面1.在结算页面初加载时 =》发送获取支付方式的请求 前端:传商品id(token一直带在请求头里) 后端:商品信息、总价、拿到**可选的支付方式2.用户选择支付方式后,点击确认订单时 =》发送获取订单号的请求 前端:传支付方式、商品id 后端:拿到**订单号orderinfo3.紧接着,在.then中判断res.meta.code===‘200’,就使用uni-app提供的uni.requestPayment...原创 2022-01-10 16:37:40 · 1758 阅读 · 0 评论 -
Uni-app 购物车页面 获取购物车数据 全选 单选 合计 删除
shopCart.vue<template> <view class="shopCart"> <u-navbar title="购物车" class="header"> <view class="slot-wrap" slot="right" @tap="goEdit">{{rightNav}}</view> </u-navbar> <scroll-view scroll-y="true" :style=原创 2022-01-09 19:03:04 · 1829 阅读 · 0 评论 -
Uni-app 课程详情页 获取课程详情 + 收藏 + 加入购物车
class-detail.vue ><template> <view class="class-detail"> <!-- 导航 --> <u-navbar title=""> <view class="header-right" slot="right"> <u-icon @tap="goCollected" v-if="isCollected" name="star-fill"原创 2022-01-09 11:20:29 · 1019 阅读 · 0 评论 -
Uni-app + uview 个人信息页 修改用户昵称、性别、个性签名
Profile.vue ><template> <view class="profile"> <u-navbar title="个人信息" :background="background"> </u-navbar> <!-- 第一组cell --> <u-cell-group class="profile-content"> <!-- 头像 --> &l原创 2022-01-07 11:42:08 · 6251 阅读 · 0 评论 -
Uni-app + uview 个人信息页 上传、剪裁头像至服务器
AvatarCropper 头像裁剪 | uView - 多平台快速开发的UI框架 - uni-app UI框架profile.vue ><template> <view class="profile"> <u-navbar title="个人信息" :background="background"> </u-navbar> <!-- 第一组cell --> <u-cell-group ..原创 2022-01-06 19:07:23 · 2468 阅读 · 0 评论 -
Uni-app 手机号+验证码登录 & 用户名密码登录登出
mine.vue > mine (tab页) 在此页面点击登陆跳转到login.vue<template> <view class="mine"> <u-navbar :is-back="false" :background="background" :border-bottom="false"> <view slot="right"> <view class="right-content">原创 2022-01-05 17:09:15 · 5927 阅读 · 2 评论 -
Uni-app 实现历史搜索和热门搜索 unshift和splice方法
<template> <view class="search"> <u-navbar> <view slot="default"> <view class="nav-center"> <u-search v-model="keyword" placeholder="Vue" :show-action="true" action-text="取消" :clearabled="fals.原创 2022-01-04 11:26:09 · 1649 阅读 · 0 评论