zoukankan      html  css  js  c++  java
  • vue路由监听问题

    背景

    image-20200913174209823

    希望路由变化时做些操作,这里控制台输出内容为例

    vue代码起初是这样,在/button对应组件使用watch:

    image-20200913174548244

    监听失败,控制台无输出。

    原因

    所要监听的路由/button不是其子路由,比如你在/a下只能监听/a这个路由的子路由的变化

    解决

    把watch相关代码搞到/button父路由对应的组件去。

    image-20200913175158281

    这里父路由“/”对应组件为Home

    image-20200913175316932

    再次测试成功:

    image-20200913175628972

    其他

    如果想监听路由参数变化,如直接在浏览器地址栏.../detail/1改为.../detail/2的详情页面,组件会复用,路由变化成功而数据依然是id=1的数据,为了解决这个不合理现象,在组件里直接可以通过beforeRouteUpdate监听路由变化,然后再次获取新id请求后台,将组件的数据属性更新即可

    image-20200913180855692

  • 相关阅读:
    1组Alpha冲刺总结
    1组Beta冲刺4/5
    1组Beta冲刺5/5
    1组Alpha冲刺4/6
    1组Alpha冲刺总结
    1组Beta冲刺2/5
    1组Beta冲刺3/5
    1组Beta冲刺2/5
    1组Alpha冲刺4/6
    1组Alpha冲刺5/6
  • 原文地址:https://www.cnblogs.com/NoRegrets/p/13662313.html
Copyright © 2011-2022 走看看