网站导航
> 文章列表 > UNIAPP实战项目笔记60 前端使用token来验证是否已经登录

UNIAPP实战项目笔记60 前端使用token来验证是否已经登录

网友: 文章列表 2024-03-21 19:26:47

UNIAPP实战项目笔记60 前端使用token来验证是否已经登录

UNIAPP实战项目笔记60 前端使用token来验证是否已经登录

获取数据库中用户是否有token值,并存入 store.user.token中,有值代表已经登录
detail页面 通过验证token拦截未登录用户bin跳转到登录页面

实际案例图片

UNIAPP实战项目笔记60 前端使用token来验证是否已经登录

后端接口文件 index.js

var express = require('express');
var router = express.Router();
var connection = require('../db/sql.js');
var user = require('../db/UserSql.js');
// 验证码
let code = '';
// 接入短信的sdk
// var QcloudSms = require('qcloudsms_js');//设置跨域访问（设置在所有的请求前面即可）
router.all("*", function (req, res, next) {//设置允许跨域的域名，*代表允许任意域名跨域res.header("Access-Control-Allow-Origin", "*");//允许的header类型res.header("Access-Control-Allow-Headers", "content-type");//跨域允许的请求方式 // res.header("Access-Control-Allow-Methods", "DELETE,PUT,POST,GET,OPTIONS");res.header("Access-Control-Allow-Methods", "*");res.header("Content-Type", "application/json;chartset=utf-8");// if (req.method == 'OPTIONS')// 	res.sendStatus(200); //让options尝试请求快速结束// elsenext();
});/* GET home page. */
router.get('/', function(req, res, next) {res.render('index', { title: 'Express' });
});/* 测试token数据. */
router.post('/api/ceshi', function(req, res, next) {console.log(111);res.send({data:{aaa:'1111'}});
});/* 注册->增加一条数据. */
router.post('/api/addUser', function(req, res, next) {// 前端给后端的数据let params = {userName:req.body.userName,userCode:req.body.code};if( params.userCode == code ){connection.query( user.insertData( params ),function(error,results, fields){res.send({data:{success:true,msg:'注册成功'}});});}
});/* 发送验证码 */
router.post('/api/code', function(req, res, next) {// 前端给后端的数据let params = {userName : req.body.userName}// 短信SDK 可以使用阿里云或腾讯云的,具体接入方式以官方NodeJS代码案例// ....// 阿里云 官方代码 https://help.aliyun.com/document_detail/112185.html// 腾讯云 官方代码 https://cloud.tencent.com/developer/article/1987501// ....// ....var paramss = [ Math.floor( Math.random()*(9999-1000)+1000 ) ] // 要发送的验证码// 模拟以获取到验证码code = paramss[0];console.log(code);// 模拟成功返回验证码res.send({data:{success:true,code : paramss[0]}})
})/* 注册验证手机号是否存在 */
router.post('/api/registered', function(req, res, next) {// 前端给后端的数据let params = {userName : req.body.phone}// 查询手机号是否存在connection.query(user.queryUserName(params),function(error,results,fields){if(results.length > 0){res.send({data:{success:false,msg:"手机号已经存在!"}});}else{res.send({data:{success:true}});}})});/* 用户登录 */
router.post('/api/login', function(req, res, next) {// 前端给后端的数据let params = {userName : req.body.userName,userPwd : req.body.userPwd}// 查询用户名或手机号是否存在connection.query(user.queryUserName(params),function(error,results,fields){if(results.length > 0){connection.query(user.queryUserPwd(params),function(erro,result){if(result.length > 0){res.send({data:{success:true,msg:"登录成功!",data:result[0]}});}else{res.send({data:{success:false,msg:"密码不正确!"}});}})}else{res.send({data:{success:false,msg:"用户名或手机号不存在!"}});}})});/* GET databases goods Detail. */
router.get('/api/goods/id', function(req, res, next) {let id = req.query.id;connection.query("select * from goods_search where id='"+id+"'",function(error,result,fields){if(error) throw error;res.send({code:"0",data:result})})
});/* GET List Page */
router.get('/api/goods/list', function(req, res, next) {res.send({code:0,name:"家居家纺",data:[{id:1,name:"家纺",data:[{name:"家纺",list:[{id:1,name:"毛巾/浴巾",imgUrl:"/static/logo.png"},{id:2,name:"枕头",imgUrl:"/static/logo.png"}]},{name:"生活用品",list:[{id:1,name:"浴室用品",imgUrl:"/static/logo.png"},{id:2,name:"洗晒",imgUrl:"/static/logo.png"}]}]},{id:2,name:"女装",data:[{name:"裙装",list:[{id:1,name:"连衣裙",imgUrl:"/static/logo.png"},{id:2,name:"半身裙",imgUrl:"/static/logo.png"}]},{name:"上衣",list:[{id:1,name:"T恤",imgUrl:"/static/logo.png"},{id:2,name:"衬衫",imgUrl:"/static/logo.png"}]}]}]});
});/* GET databases goods. */
router.get('/api/goods/search', function(req, res, next) {/* desc 降序 asc 升序    */// 获取对象的keylet [goodsName,orderName] = Object.keys(req.query);// name参数的值let name = req.query.name;// orderName的key值let order = req.query[orderName];let sql = "select * from goods_search";if(!(name == undefined || orderName == undefined || order == undefined)){sql = "select * from goods_search where name like '%"+name+"%' order by "+orderName+" "+order;}connection.query(sql,function(error,results,fields){res.send({code:"0",data:results});})
});/* 首页第一次触底的数据 */
router.get('/api/index_list/1/data/2', function(req, res, next) {res.send({code:"0",data:[          {type:"commodityList",data:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:4,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},]},]});
});/* 运动户外第二次触底的数据 */
router.get('/api/index_list/2/data/3', function(req, res, next) {res.send({code:"0",data:[          {type:"commodityList",data:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:4,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},]},]});
});/* 运动户外第一次触底的数据 */
router.get('/api/index_list/2/data/2', function(req, res, next) {res.send({code:"0",data:[          {type:"commodityList",data:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:4,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},]},]});
});/* 运动户外第一次加载的数据 */
router.get('/api/index_list/2/data/1', function(req, res, next) {res.send({code:"0",data:[          {type:"bannerList",imgUrl:"../../static/img/b3.jpg",},{type:"iconsList",data:[{imgUrl:"../../static/logo.png",name:"运动户外"},{imgUrl:"../../static/logo.png",name:"运动户外"},{imgUrl:"../../static/logo.png",name:"运动户外"},{imgUrl:"../../static/logo.png",name:"运动户外"},{imgUrl:"../../static/logo.png",name:"运动户外"},{imgUrl:"../../static/logo.png",name:"运动户外"},{imgUrl:"../../static/logo.png",name:"运动户外"},{imgUrl:"../../static/logo.png",name:"运动户外"}]},{type:"hotList",data:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"}]},{type:"shopList",data:[{bigUrl:"../../static/img/b3.jpg",data:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:4,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"}]}],},{type:"commodityList",data:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:4,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},]},]});
});/* 服饰内衣第一次加载的数据 */
router.get('/api/index_list/3/data/1', function(req, res, next) {res.send({code:"0",data:[          {type:"bannerList",imgUrl:"../../static/img/b3.jpg",},{type:"iconsList",data:[{imgUrl:"../../static/logo.png",name:"服饰内衣"},{imgUrl:"../../static/logo.png",name:"服饰内衣"},{imgUrl:"../../static/logo.png",name:"服饰内衣"},{imgUrl:"../../static/logo.png",name:"服饰内衣"},{imgUrl:"../../static/logo.png",name:"服饰内衣"},{imgUrl:"../../static/logo.png",name:"服饰内衣"},{imgUrl:"../../static/logo.png",name:"服饰内衣"},{imgUrl:"../../static/logo.png",name:"服饰内衣"}]},{type:"hotList",data:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"}]},{type:"shopList",data:[{bigUrl:"../../static/img/b3.jpg",data:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:4,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"}]}],},{type:"commodityList",data:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:4,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},]},]});
});/* 首页推荐数据 */
router.get('/api/index_list/data', function(req, res, next) {res.send({"code":0,"data":{topBar:[{id:1,name:'推荐'},{id:2,name:'运动户外'},{id:3,name:'服饰内衣'},{id:4,name:'鞋靴箱包'},{id:5,name:'美妆个护'},{id:6,name:'家居数码'},{id:7,name:'食品母婴'}],data:[{type:"swiperList",data:[{imgUrl:'/static/img/b3.jpg'},{imgUrl:'/static/img/b3.jpg'},{imgUrl:'/static/img/b3.jpg'}]},{type:"recommendList",data:[{bigUrl:"../../static/img/b3.jpg",data:[{imgUrl:'../../static/logo.png'},{imgUrl:'../../static/logo.png'},{imgUrl:'../../static/logo.png'}]},{bigUrl:"../../static/img/b3.jpg",data:[{imgUrl:'../../static/logo.png'},{imgUrl:'../../static/logo.png'},{imgUrl:'../../static/logo.png'}]}]},{type:"commodityList",data:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:4,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},]},]}})
});module.exports = router;

商品详情页面 details.vue

    <template><view class="details"><!-- 商品图 --><swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000"><swiper-item><view class="swiper-item"><image class="swiper-img" :src="goodsContent.imgUrl" mode=""></image></view></swiper-item></swiper><!-- 价格和名称 --><view class="details-goods"><view class="goods-pprice">¥{{goodsContent.pprice}} </view><view class="goods-oprice">¥{{goodsContent.oprice}} </view><view class="goods-name">{{goodsContent.name}} </view></view><!-- 商品详情图 --><view class=""><view class=""><image class="details-img" src="../../static/img/b3.jpg" mode=""></image></view><view class=""><image class="details-img" src="../../static/img/b3.jpg" mode=""></image></view><view class=""><image class="details-img" src="../../static/img/b3.jpg" mode=""></image></view><view class=""><image class="details-img" src="../../static/img/b3.jpg" mode=""></image></view><view class=""><image class="details-img" src="../../static/img/b3.jpg" mode=""></image></view><view class=""><image class="details-img" src="../../static/img/b3.jpg" mode=""></image></view></view><!-- 商品列表 --><Card cardTitle="看了又看"></Card><CommodityList :dataList="dataList"></CommodityList><!-- 底部 --><view class="details-foot"><view class="iconfont icon-xiaoxi"></view><view class="iconfont icon-31gouwuche" @tap="goShopCart"></view><view class="add-shopcart" @tap="showPop">加入购物车</view><view class="purchase" @tap="showPop">立刻购买</view></view><!-- 底部弹出层 --><view class="pop" v-show="isShow" @touchmove.stop.prevent=""><!-- 蒙层 --><view class="pop-mask" @tap="hidePop"> </view><!-- 内容块 --><view class="pop-box" :animation="animationData"><view class=""><image class="pop-img" :src="goodsContent.imgUrl" mode=""></image></view><view class="pop-num"><view class="">购买数量</view><UniNumberBox:min=1 :value="num"@change="changeNumber"></UniNumberBox></view><view class="pop-sub" @tap="addCart">确定</view></view></view></view></template><script>import $http from '@/common/api/request.js'import Card from '@/components/common/Card.vue';import CommodityList from '@/components/common/CommodityList.vue';import UniNumberBox from '@/components/uni/uni-number-box/uni-number-box.vue';import {mapMutations} from 'vuex'export default {data() {return {isShow:false,goodsContent:{},animationData:{},num:1,swiperList:[{imgUrl:"../../static/img/b3.jpg"},{imgUrl:"../../static/img/b3.jpg"},{imgUrl:"../../static/img/b3.jpg"}],dataList:[{id:1,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:2,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"},{id:3,imgUrl:"../../static/logo.png",name:"迪奥绒毛大衣,今年必抢,错过瞬时不爽了,爆款疯狂销售",pprice:"299",oprice:"659",discount:"5.2"}]};},components:{Card,CommodityList,UniNumberBox},onLoad(e) {// console.log(e.id);// 设置默认id=1if(!e.id)e.id = 1;this.getData(e.id);},// 修改返回默认行为onBackPress(){if (this.isShow) {this.hidePop();return true;  }},// 点击分享onNavigationBarButtonTap(e) {if(e.type==='share'){uni.share({provider:"weixin",type:0,scene:"WXSceneSession",title:this.goodsContent.name,href:"http://127.0.0.1:8080/#/pages/details/details?id="+this.goodsContent.id,imageUrl:this.goodsContent.imageUrl,success:function(res){uni.showTabBar({title:"分享成功"})},fail: (err) => {console.log("fail:"+ JSON.stringify(err));}})}},methods:{...mapMutations(['addShopCart']),// 改变商品数量changeNumber(index,value){this.num[index] = value;},// 请求商品getData(id){$http.request({url:"/goods/id",data:{id:id}}).then((res)=>{this.goodsContent = res[0];}).catch(()=>{uni.showToast({title:'请求失败',icon:'none'})})},showPop(){// 初始化一个动画var animation = uni.createAnimation({duration:200 // 动画时间});// 定义动画内容animation.translateY(600).step();// 导出动画数据传递给data层this.animationData = animation.export();setTimeout(()=>{this.isShow = true;animation.translateY(0).step();this.animationData = animation.export();},200)},hidePop(){var animation = uni.createAnimation({duration:200});animation.translateY(600).step();this.animationData = animation.export();this.isShow = true;setTimeout(()=>{animation.translateY(0).step();this.animationData = animation.export();this.isShow = false;},200)},// 跳转到购物车页面goShopCart(){uni.navigateTo({url:'../shopcart/shopcart'})},// 加入购物车addCart(){let goods = this.goodsContent;this.goodsContent['checked'] = false;this.goodsContent['num'] = this.num;// 加入购物车this.addShopCart(goods);// 隐藏弹出框this.hidePop();// 提示信息uni.showToast({title:"成功加入购物车",icon:"none"}) /* $http.request({url:"/ceshi",method:"POST",header:{// "Content-Type":"application/json",// "Content-Type":"application/x-www-form-urlencoded",token:true //需要验证token}}).then((res)=>{console.log(res);}).catch(()=>{uni.showToast({title:'请求失败',icon:'none'})}) */},}}</script><style lang="scss">swiper{width: 100%;height: 700rpx;}.swiper-img{width: 100%;height: 700rpx;}.details{padding-bottom: 90rpx;}.details-goods{text-align: center;font-weight: bold;font-size: 36rpx;padding: 10rpx 0;}.details-img{width: 100%;}.details-foot{position: fixed;left: 0;bottom: 0;width: 100%;height: 90rpx;display: flex;align-items: center;justify-content: center;background-color: #FFFFFF;}.details-foot .iconfont{width: 60rpx;height: 60rpx;border-radius: 100%;background-color: #000000;color: #FFFFFF;text-align: center;margin: 0 10rpx;line-height: 60rpx;}.add-shopcart{margin: 0 40rpx;padding: 6rpx 30rpx;background-color: #000000;color: #FFFFFF;border-radius: 40rpx;}.purchase{margin: 0 40rpx;padding: 6rpx 30rpx;background-color: #49BDFB;color: #FFFFFF;border-radius: 40rpx;}.pop{position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 9999;}.pop-mask{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.3);}.pop-box{position: absolute;left: 0;bottom: 0;width: 100%;background-color: #FFFFFF;}.pop-img{width: 260rpx;height: 260rpx;top:-130rpx;border-radius:20rpx 20rpx 0 0;margin: 30rpx;}.pop-sub{line-height: 80rpx;background-color: #49BDFB;color: #FFFFFF;text-align: center;}.pop-num{padding: 20rpx;display: flex;justify-content: space-between;}</style>

request.js 请求模块增加token验证

import store from '@/store/index.js';
export default{common:{baseUrl:"http://127.0.0.1:3000/api",data:{},header:{"Content-Type":"application/json","Content-Type":"application/x-www-form-urlencoded"},method:"GET",dataType:"json"},request( options={} ){uni.showLoading({title:"加载中"})options.url = this.common.baseUrl + options.url;options.data = options.data || this.common.data;options.header = options.header || this.common.header;options.method = options.method || this.common.method;options.dataType = options.dataType || this.common.dataType;// 判断是否传入 header头的token, 进行用户是否登录验证if(options.header.token){options.header.token = store.state.user.token;if(!options.header.token){uni.showToast({title:"请先登录",icon:'none'})setTimeout(()=>{uni.navigateTo({url:"/pages/login/login"})},1000)return;}}return new Promise((res,rej)=>{uni.request({...options,success: (result) => {if(result.statusCode != 200){return rej();}setTimeout(function(){uni.hideLoading();},500)let data = result.data.data;res(data);}})}) }}

目录结构

前端目录结构

  • manifest.json 配置文件： appid、logo…

  • pages.json 配置文件： 导航、 tabbar、 路由

  • main.js vue初始化入口文件

  • App.vue 全局配置：样式、全局监视

  • static 静态资源：图片、字体图标

  • page 页面

    • index
      • index.vue
    • list
      • list.vue
    • my
      • my.vue
    • my-config
      • my-config.vue
    • my-config
      • my-config.vue
    • my-add-path
      • my-add-path.vue
    • my-path-list
      • my-path-list.vue
    • search
      • search.vue
    • search-list
      • search-list.vue
    • shopcart
      • shopcart.vue
    • details
      • details.vue
    • my-order
      • my-order.vue
    • confirm-order
      • confirm-order.vue
    • payment
      • payment.vue
    • payment-success
      • payment-success.vue
    • login
      • login.vue
    • login-tel
      • login-tel.vue
    • login-code
      • login-code.vue

  • components 组件

    • index
      • Banner.vue
      • Hot.vue
      • Icons.vue
      • indexSwiper.vue
      • Recommend.vue
      • Shop.vue
      • Tabbar.vue
    • common
      • Card.vue
      • Commondity.vue
      • CommondityList.vue
      • Line.vue
      • ShopList.vue
    • order
      • order-list.vue
    • uni
      • uni-number-box
        • uni-number-box.vue
      • uni-icons
        • uni-icons.vue
      • uni-nav-bar
        • uni-nav-bar.vue
      • mpvue-citypicker
        • mpvueCityPicker.vue

  • common 公共文件：全局css文件 || 全局js文件

    • api
      • request.js
    • common.css
    • uni.css

  • store vuex状态机文件

    • modules
      • cart.js
      • path.js
      • user.js
    • index.js
网络标签：

相关问题