vue项目实战(模仿京东),技术栈vue2+vue-router+vuex+webpack+ES6,非常适合练手vue

Overview

About

技术栈 vue + vue-router + vuex 构建的移动端电商系统(模仿京东);数据都是先真实向服务器发送请求(有一个服务器端口可以响应请求,只是没有合适的数据),之后在本地替换(大体逻辑需要数据时,向该接口发送请求,得到响应后再替换成所需数据(所有数据均存放在common下的对应页面中,如home页的数据存放于home.js中)

还有就是,本人是在B站上看coderWhy老师的vue视频入门的,所以整个项目的思想,组织,构建很多都是来源是coderWhy老师,包括那个可以响应的接口,也是coderWhy老师的服务器,奈何老师把地址改了,本人也没有服务器(也不好意思去问老师,毕竟没交一分钱学费 😂 ),所以才想出这个妥协的办法;也正是看了coderWhy老师的视频后,出于对所学知识的巩固以及练练手的心态写的这个项目,取名为JustBuy也是因为看到有类似购物网站(假如你是马云,给你一千亿,随便买,所以想体验一下在自己写的“随便买”上随便买是什么感觉 😎 虽然都是女装,不是特殊癖好,只是单纯觉得写项目多少有点枯燥,看看美女图养眼 🤣 )。做完整个项目,个人感觉收获良多。在此先感谢一下coderWhy老师! 😁 。个人以为,本项目很适合练手,熟悉vue的使用,解决一些常见的问题,以及增强学习的兴趣,都大有助益,希望大家喜欢!

说明

如果对您喜欢本项目,或者本项目对您有帮助,请点 "Star" 支持一下 谢谢! 如有问题请直接在 Issues 中提,或者您发现问题并有非常好的解决方案,欢迎 PR 👍 本项目取名为JustBuy,希望您能体验到随心购的快感!

技术栈

vue2 + vuex + vue-router + webpack + ES6+

项目运行

npm install

npm run serve 

npm run build

功能列表

  • 上拉加载更多 -- 完成
  • 点击查看商品详情 -- 完成
  • 加入购物车 -- 完成
  • 购买 -- 完成(较简单)
  • 吸顶效果-- 完成
  • 滚动与导航栏联动效果 -- 完成
  • 图片懒加载-- 完成
  • 轮播图-- 完成
  • 购物车结算/勾选/数量加减 -- 完成
  • 路由懒加载 -- 完成
  • 点击滑动效果 -- 完成

页面截图展示

首页

home

分类

category

购物车

cart

我的

profile

详情

detail

You might also like...
Use of own created Api in Laravel. Vuex,Vue Router, Axios

moshop2_use_own_api Project setup npm install Compiles and hot-reloads for development npm run serve Compiles and minifies for production npm run bu

[DEPRECATED] ✏️ A blog based on GitHub Pages built with Vue.js 2 + webpack 3.
[DEPRECATED] ✏️ A blog based on GitHub Pages built with Vue.js 2 + webpack 3.

vue-ghpages-blog ✏️ A blog based on GitHub Pages built with Vue.js 2 + webpack 3. 一个依赖 GitHub Pages,无需本地生成的静态博客,使用了 Vue.js 2 组件开发,webpack 3 打包。 [DEPRE

Vue.js starter with full-featured Webpack and Buefy

Vue Webpack Buefy Vue.js starter with full-featured Webpack and Buefy Alternative to people who have problem when they project adding native Bulma. Se

Boilerplate for Chrome extension using Vue.js and Webpack with auto-reload enabled.
Boilerplate for Chrome extension using Vue.js and Webpack with auto-reload enabled.

vue-chrome-extension-boilerplate Boilerplate for Chrome extension using Vue.js and Webpack with auto-reload enabled. Scripts // install dependencies n

Electron with webpack and Vue.js

Electron with webpack and Vue.js https://youtu.be/oL7vIDkDOsg Install Node.js. Within this folder run the terminal command npm install to install the

适合新手入门实战项目,Vue 2.x + Vue-Router + Element + Axios 开发的简单后台管理系统
适合新手入门实战项目,Vue 2.x + Vue-Router + Element + Axios 开发的简单后台管理系统

适合新手入门实战项目,Vue 2.x + Vue-Router + Element + Axios 开发的简单后台管理系统

This is a version of Sigma Vue Project running inside a Laravel app with Inertia Js as a connection instead of Vue Router

About this project This is a version of Sigma Vue Project running inside a Laravel app with Inertia Js as a connection instead of Vue Router. Sigma Vu

Desafio 1: Implementación de Vue Router y uso de rutas

v8blog Project setup npm install Compiles and hot-reloads for development npm run serve Compiles and minifies for production npm run build Run your

An exemplary real-world application built with Vue.js, Vuex, axios and different other technologies. This is a good example to discover Vue for beginners.
An exemplary real-world application built with Vue.js, Vuex, axios and different other technologies. This is a good example to discover Vue for beginners.

Vue.js codebase containing real world examples (CRUD, auth, advanced patterns, etc) that adheres to the RealWorld spec and API. Project demo is availa

Owner
coderOrange
a student in colleage, want to enhance self skills
coderOrange
WordPress module for Vue.js, PWA ready, with full support for Vuex Store, Vue Router, Vue SSR and Nuxt.js.

WordPress module for Vue.js, PWA ready, with full support for Vuex Store, Vue Router, Vue SSR and Nuxt.js.

Vue WordPress 26 Apr 9, 2022
Meals App using Vue.js 2, Vuetify, Vuex, Vue-Router & Axios.

Meals App using Vue.js 2, Vuetify, Vuex, Vue-Router & Axios.

Alexanyer Naranjo 7 Feb 4, 2022
Basic vuejs project boiler-plate setup with tailwindcss, vuex, vue-router, vue-i18n...

Basic vuejs project boiler-plate setup with tailwindcss, vuex, vue-router, vue-i18n...

fotiecodes 2 Nov 3, 2022
A minimal sample configuration with vue, vuex, vue-router, vuetify, Typescript and cesium.

vue-stack-cesium A minimal sample configuration project which shows how to combine and use certain packages and is a useful testing project for new up

Gerhard Mesch 14 Dec 23, 2022
A Social Media Web App built with Vue.js, Firebase, Element-UI, Disqus, Vuex, Vue-Router, and Sass.

All-About-Me A Social Media Web App built with Vue.js, Firebase, Element-UI, Disqus, Vuex, Vue-Router, and Sass. Online Demo https://bb-all-about-me.n

Amber Hung 14 Apr 18, 2022
VueShop is Shopping cart demo using Vue js, vue-router, vuex.

?? Table of Contents About website description Project setup Compiles and hot-reloads for development Website link ScreenShots Contributors About VueS

Asmaa Adel 3 Oct 27, 2022
mmf-blog vue2.0 (vue2, vue-router, vuex)

mmf-blog vuejs 2.0 v2 中文说明 demo: http://vue2.mmxiaowu.com The main technical stack: vue2, vue2-router, vuex, webpack, babel, eslint Other versions rea

LinCenYing 237 Jul 18, 2022
A fully responsible Studio Ghibli finder app that searches and filters movies using Vue3,Vuex,Vue Router,Bootstrap5 and Scss.

vue-ghibli-studio-app A fully responsible Studio Ghibli finder app that searches and filters movies. It was created by using Vue3,Vuex,Vue Router,Boot

Emre Süslü 0 Oct 27, 2021
Full CRUD using vuex, vue router, firebase and composition API

vue3-firebase Project setup yarn install Compiles and hot-reloads for development yarn serve Compiles and minifies for production yarn build Lints

J Not Query 1 Dec 27, 2021
this repo demonstrates the vuejs app using vuetify, vuex, vue router

news-app, a vuejs app this repo demonstrates the vuejs app using vuetify, vuex, axios, and vue-router requirements this app requires the following to

bondythegreat 1 Feb 2, 2022