前言
继续看上期的教程
多页应用 VS 单页应用
多页应用每一次范文都会从服务器返回HTML文件
减少Http请求,不利于搜索引擎抓取
通过服务器渲染可以解决单页应用的一些问题
vue cli 环境配置
设置移动端的显示效果,使页面无法缩放。
路径标识 @ 表示 src 文件夹路径
引用 reset.css 确保移动端上所有设备的初始 css 是统一的
引用 border.css 确保移动设备渲染边框都是占用一个像素的
为了兼容双击命令,浏览器默认的单机延迟为 300 ms
这可能会对移动端的交互体验产生印象,因此可以安装 fastclick 库 来解决问题。
webpack设置可以配置路径 @ 符号路径也源于此
修改webpack配置需要重启服务器
ajax网络请求
通过 webpack-dev-server 的配置可以实现将 api 的地址替换为 /static/mock 方便我们读取json进行接口测试
在 swiper 中通过 ajax 获取数据,会因为组件提前生成导致数据生成的时候不在第一个轮播图上显示
通过 v-if 可以实现判断数据再去实现轮播图
HTML中尽量减少逻辑层的代码,可以将相关代码写到函数当中