1.架构从传统的MVC向REST API+前端MV*迁移

参考链接:

http://blog.csdn.net/broadview2006/article/details/8615055

http://blog.csdn.net/u013628152/article/details/42709033

MV*包括:MVC、MVP、MVVM

vue.js是MVVM框架

2.Iconmoon制作图标字体

2.1 点击IconMoon App

2.2点击import icons,导入svg图片

2.3选择你导入的图标,并点击右下角generate font

2.4点击get code

2.5点击preference命名font name

2.6导出后得到如下文件,拷贝fonts文件和style.css

3.data.json中存放数据(模拟数据库),模拟的数据请求就从该源中读取数据。

3.1打开build目录,找到dev-server.js(webpack打包的入口文件),从data.json中读取数据(图中红色部分)

3.2编写路由(图中粉红色部分)

3.3通过接口查看数据

4.reset.css的引入,其中自定义了一部分,去掉icon.styl中的{}和;

5.移动端的视口的相关设置

6.在main.js中添加分号;

编译报错,可以访问提示的链接

在eslintrc.js中修改关于分号的配置

将App.vue中的各个标签清空(等待重新编写),删掉hello.vue文件

【Vue.js】高仿饿了么外卖App(一)的更多相关文章

  1. Vuejs 高仿饿了么外卖APP 百度云视频教程下载

    Vuejs 高仿饿了么外卖APP 百度云视频教程下载 链接:https://pan.baidu.com/s/1KPbKog0qJqXI-2ztQ19o7w 提取码: 关注公众号[GitHubCN]回复 ...

  2. Vue.js高仿饿了么WebApp

    介绍 学习Vue.js也有一阵子了,为了加深对Vue的理解及运用,做了一个小项目.这是一个高仿饿了么外卖WebApp,现已完成商品预览.商品详情.商家预览.添加购物.查看评论等功能. 部分截图 项目预 ...

  3. vue.js高仿饿了么(前期整理)

    1.熟悉项目开发流程 需求分析——>脚手架工具——>数据mock——>架构设计——>代码编写——>自测——>编译打包. 2.熟悉代码规范 从架构设计.组件抽象.模块 ...

  4. 【饿了么】—— Vue2.0高仿饿了么核心模块&移动端Web App项目爬坑(三)

    前言:接着上一篇项目总结,这一篇是学习过程记录的最后一篇,这里会梳理:评论组件.商家组件.优化.打包.相关资料链接.项目github地址:https://github.com/66Web/ljq_el ...

  5. 基于vue2+nuxt构建的高仿饿了么(2018版)

    前言 高仿饿了么,以nuxt作为vue的服务端渲染,适合刚接触或者准备上vue ssr的同学参考和学习 项目地址如遇网络不佳,请移步国内镜像加速节点 效果演示 查看demo请戳这里(请用chrome手 ...

  6. 用vue2 +vue-router2 + es6 +webpack 高仿饿了么app(干货满满)

    #高仿饿了么app商家详情 (vue2 +vue-router2 + es6 +webpack )   ##demo [demo 地址](http://liangxiaojuan.github.io/ ...

  7. 使用Vue.js制作仿Metronic高级表格(一)静态设计

    Metronic高级表格是Metonic框架中自行实现的表格,其底层是Datatables.本教程将主要使用Vue实现交互部分,使用Bootstrap做样式库.jQuery做部分用户交互(弹窗). 使 ...

  8. 慕课网,vue高仿饿了吗ASP源码视频笔记

    1.源码笔记 我的源码+笔记(很重要):http://pan.baidu.com/s/1geI4i2Z 感谢麦子学院项目相关视频 2.参考资料 Vue.js官网(https://vuejs.org.c ...

  9. VUE高仿饿了么app开发思维导图

    来自互联网 文章来源:刘俊涛的博客 地址:http://www.cnblogs.com/lovebing

随机推荐

  1. [C语言] 数据结构-衡量算法的标准

    1.衡量算法的标准 算法 解题的方法和步骤 衡量算法的标准 1.时间复杂度 大概程序要执行的次数,而非执行的时间,不同的机器运行时间肯定不一样. 2.空间复杂度 算法执行过程中大概所占用的最大内存 3 ...

  2. MySql的隔离级别总结

    使用MySql也有一段时间了,但是很多MySql相关或者说是数据库相关的知识还是一知半解,最近在学hibernate这个框架时碰到挺多和数据库相关的知识盲区,所以下面根据自己对MySql系统相关知识消 ...

  3. 7、包装类、System、Math、Arrays、大数据运算

    基本类型封装 基本数据类型对象包装类概述 *A:基本数据类型对象包装类概述 *a.基本类型包装类的产生 在实际程序使用中,程序界面上用户输入的数据都是以字符串类型进行存储的.而程序开发中,我们需要把字 ...

  4. css3怎么分清伪类和伪元素

    伪类用于向某些选择器添加特殊的效果. 伪元素用于将特殊的效果添加到某些选择器. 伪类有::first-child ,:link:,vistited,:hover,:active,:focus,:lan ...

  5. js如何获取response header信息

    信息转自网上 普通的请求JS无法获取,只有ajax请求才能获取到. $.ajax({ type: 'HEAD', // 获取头信息,type=HEAD即可 url : window.location. ...

  6. 基于Apache Curator框架的ZooKeeper使用详解

    一 简介 Apache Curator是一个比较完善的ZooKeeper客户端框架,通过封装的一套高级API 简化了ZooKeeper的操作.通过查看官方文档,可以发现Curator主要解决了三类问题 ...

  7. 01_Netty简述

    [Netty的NIO模型与常见的NIO模型对比] [原始的BIO模型] ServerSocket serverSocket = Socket clientSocket = serverSocket.a ...

  8. PHP计算近1年的所有月份

    $z = date('Y-m'); $a = date('Y-m', strtotime('-12 months')); $begin = new DateTime($a); $end = new D ...

  9. Non-resolvable parent POM for com.*******

    场景: 同事新打了一个jar包到私服里面,自己删除了本地对应的中央仓库的依赖包,再次重新下载.  于是我又打开了一个idea的窗口重新引入这个项目,然后重新下载依赖的服务. 结果就一直报这个问题... ...

  10. org.springframework.data.mongodb.core.MongoTemplate]: Constructor threw exception; nested exception is java.lang.NoSuchMethodError: org.springframework.core.convert.support.ConversionServiceFactory.cr

    spring-data-mongo 和spring core包冲突.解决办法: <dependency> <groupId>org.springframework.data&l ...