vue大型电商项目尚品汇（前台篇）day02.doc

Vue 大型电商项目尚品汇（前台篇）day02 本文是对 Vue 大型电商项目尚品汇（前台篇）day02 的总结，主要涵盖了 Vue 项目中的技术要点。 一、重写 push/replace 方法 在 Vue 项目中，我们需要重写 push/replace 方法来解决编程式导航的 bug。这个 bug 是因为 Vue 在 2.x 版本中添加了 promise，使得编程式导航跳转的添加了一个 promise，我们需要定义成功回调和失败回调来解决这个问题。 通过重写 push/replace 方法，我们可以解决这个问题。我们需要找到 VueRouter 的构造函数，然后重写 push/replace 方法。我们可以判断传入的参数是否包含两个回调，如果有就执行回调，如果没有就自动写上两个回调。 二、Home 模块组件拆分 在 Home 模块中，我们需要拆分组件。在这个过程中，我们首先需要完成静态页面，然后进行模块拆分，最后是一些事件的完成。我们可以将 Home 模块拆分为七个组件，分别是三级联动效果、轮播图、今日推荐、热卖排行、猜你喜欢、家用电器和 log 组件。 三、axios 相关配置 在 Vue 项目中，我们需要对 axios 进行二次封装。 axios 的主要目的是为了请求拦截器和响应拦截器。我们可以在 src 下面创建一个 api 的文件夹，并在其中创建一个 request 文件来配置 axios。 在 request 文件中，我们可以使用 axios 的 create 方法创建一个自定义的 axios 实例，然后添加请求和响应拦截器。我们可以使用 config 来设置请求头，并使用 Promise.reject 方法来返回一个错误的 promise 对象。 本文总结了 Vue 大型电商项目尚品汇（前台篇）day02 中的技术要点，涵盖了重写 push/replace 方法、Home 模块组件拆分和 axios 相关配置等方面的内容。