vue 博客知识点汇总

1. vue修改url,页面不刷新

项目中经常会用到同一个页面,结构是相同的,我只是在vue-router中通过添加参数的方式来区分状态,参数可以在页面跳转时带上params,或者query,但是有一个问题,即使我们修改了参数,URL也显示已经改变,但页面并不会刷新,因为路由是相同的,vue就会认为你是同一个页面,从而复用已加载的页面,而不会重新加载,所以如果在created钩子中来区分状态明显是行不通的,可以通过watch监听事件来监听路由的变化:

 watch: {
    $route(to, from) {
      if (to.query.page !== from.query.page) {
        this.jumpPages();
      }
    }
  },

2.组件内部 beforeRouteLeave

使用导航守卫,必须用在页面级别的组件中,如果是组件内部嵌套的组件不生效。

3. vue 属性中使用变量拼接

div(
    class="drag-list-item" 
    v-for="(params, index) in showChartsList" 
    :key="index" 
    :style="{'marginTop': '20px', 'cursor': 'move'}"
    :ref="params+'div'"
)

params是变量,div是要拼接的字符串

原文地址:https://www.cnblogs.com/xiaozhumaopao/p/11657646.html