vue练手项目（day4：重写push和replace、完成Home的子组件）

0.前言

        为啥要重写push和replace，主要是你不写他会报错啊，为啥会报错呢，主要是因为函数式路由push方法返回的是一个promise对象，我们知道promise对象是有成功回调和失败回调的，但是我们并没有传入相应的回调就会出错。所以需要进行重写

1.重写$router.push

• 首先把原本的push函数保存下来
• 接下来重写router.prototype上的push方法
• 如果外界传入了resolve和rejected回调，那么就用外部传入的，否则就传入一个空函数作为回调，这样就可以避免没有传入回调时的报错。
• 至于为什么要用call，因为originPush已经被抽取为一个全局函数了，那么如果push被调用的时候如果不显式指定this那么this会指向window而不是vc实例

• let originPush = VueRouter.prototype.push;
  VueRouter.prototype.push = function(localtion,resolve,rejest)
  {
      if(resolve&&rejest)
      {
          originPush.call(this,localtion,resolve,rejest);
      }
      else
          originPush.call(this,localtion,()=>{},()=>{});
  }

2.重写$router.replace

       和重写push几乎一样的

3.完成Home的子组件

        这里因为三图联动这个组件被多次复用，所以将这个组件注册成一个全局组件，全局组件的注册方式：

• 通过Vue.component（’组件名‘，’组件‘）的方式指定

• // 因为三级联动的结构多处用到，所以注册称全局组件
  import TypeNav from './pages/Home/TypeNav'
  Vue.component(TypeNav.name,TypeNav)

  其余的静态组件就按照：结构、样式、资源的顺序依次创建出来，然后引入、注册、使用一条龙服务即可完成