vue数据渲染的问题

Question

我这页面上的4个按钮点进去都是下面那个页面，只是数据不同，那我要如何在点击的时候加载不同的数据到这个页面组件上呢？
这个项目是用vue+vue-router做的,数据使用VueResource获取的

Answer 1

最后是通过这种方法解决的，不过不知道思路对不对，有错请指出。
当点击collection()这个方法的时候，跳转并带上标识，
collection() {

this.$router.push({path: 'notSee', query: { id: '1' }});

},
然后在组件中通过判断query.id来加载不同的数据进去
getDataList() {

   const queryId = this.$route.query.id;
   this.$http.get('api/all').then((response) => {
      response = response.data.data;
      if (queryId === '1') {
        this.publicData = response.collection[0];
      } else if (queryId === '2') {
        this.publicData = response.hot[0];
      }
    });
  }

Answer 2

router的path上添加参数 标示相应的数据类型，
然后在router的beforeRouteEnter或者actived中进行类型判断 取数 填数

Answer 3

都用这个页面，就表示是一个组件了。可以利用子组件props传参吧。根据点击不同的按钮，给props的参数赋值对应的数据。如果没有理解错的话，你可以看下https://cn.vuejs.org/v2/guide...。