VUE路由点击URL改变但是页面没有重新渲染

路由点击URL改变但是页面没有重新渲染在处理商城项目，根据id获取相似商品，再通过路由点击跳转时，路由发生了改变，但是页面却没有重新渲染router.go(0)会丢失高度,不采取该方法，使用以下代码，在router-view上添加:key="$route.fullPath" 完美解决，原因大概是VUE为了节约性能<router-view :key="$route.fullPath" /&g

YoungDoCui

3181人浏览 · 2021-04-02 22:21:37

YoungDoCui · 2021-04-02 22:21:37 发布

路由点击URL改变但是页面没有重新渲染
在处理商城项目，根据id获取相似商品，再通过路由点击跳转时，路由发生了改变，但是页面却没有重新渲染router.go(0)会丢失高度,不采取该方法，使用以下代码，在router-view上添加:key="$route.fullPath" 完美解决，原因大概是VUE为了节约性能

<router-view :key="$route.fullPath" />

然而在遇到有二级路由的情况，会遇到点击样式消失的情况，就需要使用watch重新执行渲染了

watch: {
    $route(to, from) {
      if(to.path!==from.path)
      this.getDetailItem_init()
    },
  },

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^