摘要：
对Vuex的理解 Vuex是一个专为Vue.js应用程序开发的状态管理模式，它采用集中式存储管理应用的所有组件的状态 你可以简单的将其看成把需要多个组件共享的变量全部存储在一个对象里，然后将这个对象放在顶层的Vue实例中，让其它组件可以使用，那么，多个组件就可以共享这个对象中的所有变量了，这些变量相 阅读全文
摘要：
v-once 该指令表示元素和组件值渲染一次，不会随着数据的改变而改变 <script type="text/javascript"> const app = new Vue({ el: "#app", data: { message: "你好", firstName: "kobe", lastNa 阅读全文
摘要：
传递参数有两种类型： params和query params类型 配置路由格式：/router/:id 传递的方式：在path后面跟上对应的值 传递后形成的路径：/router/123，/router/abc ①路由配置格式，使用冒号':' { path: '/user/:user_id', com 阅读全文
摘要：
vue-router的定义 这里的路由并不是我们平时所说的硬件路由器，这里的路由就是单页面应用1的路径管理器 vue-router是Vue.js官方提供的路由插件，它和vue.js是深度集成的，适合用于构建单页面应用。 vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径与组件映射起 阅读全文
摘要：
v-on的介绍 在Vue中，常使用v-on指令用于监听事件的发生，v-on指令就类似于JavaScript中的addEvelistener()方法 v-on的基本使用 <div id="app"> <h2>{{counter}}</h2> <!-- 监听一个click鼠标点击事件 --> <butt 阅读全文
摘要：
v-for的引入 当我们需要对一组数据进行渲染时，我们就可以使用v-for来完成 v-for遍历数组 格式：v-for="(item, index) in items"。（也许是因为item显得更加重要，所以将item排在前面） 格式说明：index为可选参数，当不需要获取每一项的索引值时，可以省略 阅读全文
摘要：
toast弹框的作用 toast弹框顾名思义，就是为了弹出一个提示框，效果如图： 使用toast弹框可以可用户带来更好的交互体验 toast弹框的使用 Toast组件 制做出toast的样式以及出现的条件 <template> <div class="toast" v-show="isShow"> 阅读全文
摘要：
Promise的理解 Promise是对异步操作的一种解决方案，一般情况下，如果有异步操作，就需要使用Promise对这个异步操作进行封装 使用Promise后可以使代码看起来更加优雅并且易于维护 使用定时器模拟一个异步请求 Promise接收一个函数作为参数，而这个函数又接收两个参数，这两个参数分 阅读全文
摘要：
理解keep-alive keep-alive是Vue内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染 router-view也是一个组件，如果直接被keep-alive包在里面，所有路径匹配到的视图都会被缓存 <keep-alive> <router-view></router-view 阅读全文
摘要：
组件化思想 如果我们将一个页面中的所有处理逻辑全部放在一起，处理起来就会变得非常复杂，而且不利于后续的管理和扩展。但如果，我们将一个页面拆分成一个个小的功能块，每个功能块完成属于自己这部分独立的功能，那么整个页面的管理和维护就会变得非常容易了 组件的定义 组件是一个单独功能模块的封装，在这个模块中， 阅读全文
摘要：
axios的定义 axios是一个基于Promise，用于浏览器和node的HTTP客户端 axios的功能特点 在浏览器中发送 XMLHttpRsquests 请求 在node.js中发送http请求 支持Promise API 拦截请求和响应 转换请求和响应数据 等等 axios框架的基本使用 阅读全文
摘要：
为什么需要图片懒加载 简而言之就是为了提高前端性能。 图片在需要的时候才加载，减轻服务的负担，提高页面的加载速度，提高用户体验。 图片懒加载的使用 ①npm安装 npm install vue-lazyload -S ②安装图片懒加载插件 // main.js import VueLazyLoad 阅读全文
摘要：
认识懒加载 路由中通常会定义很多不同的页面，这些页面通常情况下会被打包到一个js文件中，如果我们一次性请求完这些页面，可能会花费一定的时间，甚至用户的电脑都可能会出现短暂的白屏，为了避免这种情况，就必须使用路由懒加载 路由懒加载的作用就是路由对应的组件会被打包成一个个js代码，只有在这个路由被访问到 阅读全文
摘要：
为什么要使用fastclick 移动设备上的浏览器默认会在用户点击屏幕大约延迟300毫秒后才会触发点击事件，这是为了检查用户是否在做双击。为了能够立即响应用户的点击事件，才有了fastclick。 fastclick的使用 fastclick的使用非常简单 ①npm安装 npm install fa 阅读全文
摘要：
为什么要用计算属性 我们知道，在模板中，我们可以直接通过插值语法显示一些data中的数据，但是在某些情况下，我们可能需要对数据进行一些转化后再显示，或者需要将多个数据结合起来进行显示。 比如我们有firstName和lastName两个变量，而如果我们需要显示完整的名称，可能就需要写上{{first 阅读全文
摘要：
认识better-scroll better-scroll是一款重点用于解决移动端（已支持PC）各种滚动场景需求的插件，可使页面滚动效果更加流畅且富有弹性 better-scroll是用纯JavaScript编写的，这意味着它是无依赖的 better-scroll的原理 BetterScroll是作 阅读全文
摘要：
父子组件关系图 子组件通过props属性拿到父组件的内容，父组件通过接受子组件发射的事件拿到子组件内容 父组件向子组件传递数据 在父组件里以标签的形式写入子组件 通过v-bind动态绑定子组件的属性来获取父组件的数据，此时banners=bbanners <home-swiper :banners= 阅读全文
摘要：
什么是导航守卫 vue-router提供的导航守卫主要用来监听路由的进入和离开 vue-router提供了beforeEach()和afterEach()等钩子函数，这些钩子函数分别会在路由改变前后触发，正是这些钩子函数构成了导航守卫 记住参数或查询的改变并不会触发进入/离开的导航守卫 导航守卫的使 阅读全文
摘要：
插槽的功能 插槽是为了使设备具有扩展性，而组件中的插槽同样是为了使组件具有扩展性 插槽的使用方式 抽取共性，保留不同 将共性抽取到组件中，将不同暴露为插槽 一旦我们预留了插槽，就可以让使用者根据自己的需求，决定插槽中插入什么内容 插槽的基本使用 使用特殊标签<slot></slot>即可设置一个插槽 阅读全文