vue-(watch/mode/scrollBehavior)应用

一、watch：实时监听路由传参数时做相应数据变化

data(){
  return{
     shopid:1,     
  }
},
created(){
    this.fetchData()
  },
watch:{
  // 如果路由有变化，会再次执行该方法
   '$route': 'fetchData'
   },
methods:{
  fetchData () {            
    this.shopid=this.$route.query.shopid;
    //因为实时监听路由的变化执行该方法 当没有传入时console会报错  解决方法是没有传入参数时 给设置默认参数
    if(this.$route.query.shopid==undefined){
      console.log('shopid=='+this.$route.query.shopid);
      this.shopid=1;
    }           
    axios.get('http://172.16.2.43:8080/static/data/mt_index_detail.json').then((res)=>{   
                     
    })                          
  },
  goback(){  //返回
    this.$router.go(-1);

  },

二、路由跳转切换页面时滚动条不置顶 保持原来位置的解决方法（可以设置滚动到相应的位置）

路由文件 router/index.js

export default new Router({
 mode:'history',
 scrollBehavior: function (to, from, savedPosition) {
      return savedPosition || { x: 0, y: 0 }
   },
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld

    },

....}

)}