• Stars
    star
    125
  • Rank 285,485 (Top 6 %)
  • Language Vue
  • Created about 7 years ago
  • Updated about 6 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

这是一个基于vue2开发在线商城前端

lyf-vue

这是一个基于vue2开发在线商城,目前已完成大部分,先将其开源给感兴趣的同学学习参考!

目录结构

│  bus.js //组件通信
│  main.js //入口文件
│  
├─api //公共方法等
│      filter.js
│      http.js
│      methods.js
│      sess.js
│      
├─assets
│  ├─icon
│  └─images
│          
├─components
│  │  Index.vue
│  │  
│  ├─layout //布局
│  │      action-sheet.vue //sku弹窗
│  │      cart-data.vue //购物车有数据
│  │      cart-no-data.vue //购物车无数据
│  │      footnav.vue //底部
│  │      lyf-tab-bar.vue //tabbar
│  │      order-store-voucher-list.vue
│  │      scroll.vue
│  │      voucher-list.vue
│  │      
│  └─page
│      │  auth.vue //登录授权回调页(仅作为测试用)
│      │  login.vue //登录页
│      │  
│      ├─index (首页)
│      │      cart.vue //购物车
│      │      class_all.vue //分类
│      │      discovery.vue
│      │      home.vue //首页
│      │      user.vue //用户用心
│      │      
│      ├─mall //商城
│      │      catgoods.vue //分类商品
│      │      comment-list.vue //评论列表
│      │      goods_detail.vue //产品详情
│      │      store_home.vue //店铺首页
│      │      
│      ├─news //新闻(未完成)
│      │      news-detail.vue
│      │      
│      ├─order //订单
│      │      buy-now.vue //订单确认页
│      │      order-detail.vue //订单详情
│      │      order-list.vue //订单列表
│      │      order-logistics.vue
│      │      order-pay-success.vue //订单支付成功
│      │      order-rate.vue
│      │      order-refund-list.vue //售后
│      │      order-refund-return.vue //售后
│      │      order-refund-start.vue //售后
│      │      order-refund.vue //售后
│      │      
│      ├─user //用户
│      │      address-from.vue //收货地址编辑
│      │      addresses.vue //收货地址
│      │      favorite.vue //
│      │      friend-list.vue
│      │      message-detail.vue
│      │      message-list.vue
│      │      my-voucher.vue
│      │      question-detail.vue
│      │      question-list.vue
│      │      setting.vue
│      │      
│      └─wallet //钱包
│              my-money.vue
│              transaction-list.vue
│              wallet.vue
│              
└─store //vuex定义
    │  index.js //主
    └─modules
            actionsheet.js
            class_index.js
            common.js
            discovery.js
            home.js
            orderlist.js
            page_load_state.js

项目如何运行

git clone https://github.com/SmallRuralDog/lyf-vue.git
cd lyf-vue
npm install
npm run dev

由于开源代码使用的接口是我这边的测试接口,如果需要加入自己的业务请自行开发接口,接口可具体查看源码,或可参考shopnc,商城后端是查考shopnc开发的,接口返回字段基本和shopnc相同

项目使用的一些组件

  • axios
  • better-scroll
  • lib-flexible
  • mint-ui
  • vue-awesome-swiper
  • vue-lazyload
  • vue-router
  • vuex

项目是基于 vonic 2.0.0-beta.15搭建,不建议直接做为线上项目,本源码只做为参考学习,大神勿喷!!喜欢的点一下 star !蟹蟹-- 另外我还开源了微信小程序,感兴趣的也可以去看看--

关注我的头条号

头条扫一扫 干货随便找

More Repositories

1

electron-vue-music

基于 electron-vue 开发的音乐播放器,界面模仿QQ音乐,技术栈electron-vue+vue+vuex+vue-router+element- UI。欢迎star
JavaScript
2,119
star
2

vue3-music

VUE3+TS 开发的音乐播放器,界面模仿QQ音乐mac客户端,支持黑夜模式
Vue
1,543
star
3

laravel-vue-admin

开箱即用的Laravel后台扩展,前后端分离,后端控制前端组件,无需编写vue即可创建一个vue+vuex+vue-route+elment-ui+laravel的项目 ,丰富的表单 表格组件,强大的自定义组件功能。
PHP
414
star
4

auto-login-alimama

自动登录阿里妈妈,采集淘宝客推广订单数据,创建推广位,获取推广位列表
Python
309
star
5

cloud-doc

一个在线文档阅读的微信小程序
JavaScript
266
star
6

yundocs

云档3.0版本,taro开发。可打包多平台小程序,h5,IOS和Android客户端。欢迎star跟进
TypeScript
150
star
7

laravel-b2c-store

laravel 即插即用的b2c商城扩展。
PHP
122
star
8

web3modal-vue

A single Web3 / Ethereum provider solution for all Wallets
Vue
109
star
9

pay-school

一个付费课程的前端 基于 vue2.0+vuex+vue-router+vux
Vue
99
star
10

amis-admin

laravel + amis 后台管理系统,完整支持amis全部功能
PHP
92
star
11

cloud-doc-server

云档服务端
PHP
83
star
12

rn-news

react native开发的新闻阅读客户端
JavaScript
51
star
13

gf-websocket

GoFrame websocket 的应用
40
star
14

laravel-b2c-store-react

JavaScript
27
star
15

cloud-doc-v2

云档新版小程序端,基于mpvue开发
Vue
26
star
16

help-center

laravel-admin 帮助中心 工单中心
PHP
24
star
17

light-box

laravel-admin light-box扩展
CSS
8
star
18

atlas-restore

atlas还原工具,layaAri游戏图集还原
Python
7
star
19

laravel-vue-admin-demo-old

PHP
6
star
20

react-native-kuaibao

仿照天天快报的app客户端,基于react native开发
JavaScript
3
star
21

laravel-custom

laravel 5.5+ 自定义的扩展帮助工具
PHP
2
star
22

electron-vue3-music

Vue
2
star
23

w-admin

一个简单易用的中后台,基于typescript + umijs + antd + dva
TypeScript
1
star
24

fant

Lightweight Flutter UI Components built on Vant
Dart
1
star