1

1.用vue做单页应用时,当页面滚动之后,跳转到其他页面,如果跳转到的页面大于一屏的高度,该页面的滚动条不会置顶

解决方案:
在router.js底部加上如下代码

scrollBehavior (to, from, savedPosition) {
    // return 期望滚动到哪个的位置
    return { x: 0, y: 0 }
}

2.if-else闪烁问题,初始数据为空,当created里的接口请求的数据过来之后,页面会出现dom更新的闪烁问题

解决方案:
运用组建内路由前置守卫,提前请求数据,在挂载dom前更新数据,关于路由守卫可参考路由守卫

{
  beforeRouteEnter (to, from, next) {  //next需要被主动调用,不然跳转不到该页面
    serv.test()
      .then(res => {
        next(vm => {       // 这里还无法访问到组件实例,this === undefined
          // 通过 `vm` 访问组件实例
          vm.listData = res.data.results
        })
      })
      .catch(err => {
        console.log(err)
      })
  },
  mounted () {
    console.log(this.listData) // undefind
  }
}

此路由守卫还可以用于权限拦截和页面非法跳转

3.vue数据双向绑定,数据改变后不能立马反映到视图上,在给vue data中object类型数据赋值时存在不实时显示的情况

解决方案:
见Vue.js中文官网->进阶->深入响应式原理->变化检测问题

Vue.set(vm.someObject, 'b', 2)
this.$set(this.someObject,'b',2)

听风语
21 声望2 粉丝

享受coding,享受生活!