Javascript Vue.js-如何将数据传递到其他路由？

我是Vue.js的新手，有一个问题

首先，我使用以下代码从后端应用程序获取所有数据：

var app2 = new Vue({
    delimiters: ['%%', '%%'],
    el: '#app2',

    data: {
        articles: []
    },

    mounted : function()
    {
        this.loadData();
    },

    methods: {
        loadData: function() {
            this.$http.get('/backend/FpArticle/articleApi').then(response => {
                // get body data
                this.articles = response.body;
            }, response => {
                // error callback
            });
        },

    },

我想这很简单。现在，我在表格视图中显示前端文章中的数据。所以我做了这样的事情：

<tr v-for="article in articles">
  <td>{{ article.name }}</td>
</tr>

<tr v-for="article in articles">
  <td>{{ article.name }}</td>
  <td><a href="/article/{{ article.id }}">edit</a></td>
</tr>

{{article.name}

这很有效。但是现在我想创建一个编辑掩码，用户可以在其中更改本文的一些数据元素。所以我假设这样做：

<tr v-for="article in articles">
  <td>{{ article.name }}</td>
</tr>

<tr v-for="article in articles">
  <td>{{ article.name }}</td>
  <td><a href="/article/{{ article.id }}">edit</a></td>
</tr>

{{article.name}

因此，我需要另一个组件，它获取id，读取文章的数据，以表单形式显示，并处理保存事件。我想我知道如何解决后一部分，但如何使用新组件进行路由？或者在Vue中有更好的推荐方式吗？也许是这样的

<tr v-for="article in articles">
  <td>{{ article.name }}</td>
  <td><button v-on:click="editArticle(article.id)">edit</button></td>
</tr>

{{article.name}
编辑

---

谢谢你给我的提示！谢谢

是的，你在正确的轨道上。您想使用

VueRouter

。您必须使用组件配置路由。例如：

const router = new VueRouter({
  routes: [
    { path: '/articles', component: ArticlesList },
    { path: '/articles/:id', component: Article }
  ]
})

---

然后，您将通过

（在

编辑文章中呈现为
）访问
文章
视图，是否尝试使用
路由器。推送
？