Question

我有一个调用的函数。

 editTrade: function(tradeData) {
    //include index and/or get object from store
    //forward through router.
    this.$router.push({name: '/trading/newTrade', params: {tradeData}})

当我单击此端点时，页面将刷新，它显示/而不是预期的路由，并且会丢失所有数据，因此当我转至该路由时，该页面为空。

URL栏具有正确的路由，但页面不正确。我仔细阅读了文档，如果要发送参数，则应使用name:，我也尝试了router.push，如文档中所述，但无济于事。

Answer 1

仅当命名路由时，才能使用其名称引用路由。确保您引用的路由在Vue Router对象的路由定义中具有[FORM_ERROR]: 'Login Failed'参数。

您还可以通过使用路径而不是名称来以编程方式导航至路径。在您的情况下，它看起来像这样：

name

Documentation reference

Answer 2

我成功了，就我而言，我只要按一下按钮就可以完成，无论如何这都是我的用例。 b-button是VueBootstrap。我确实将name更改为一个简单的字符串。

<b-button
  class="cardButton"
  variant="secondary"
  //This is where the magic happens
  to="{ name: 'newTrade', params: {trade} }"
> Edit </b-button>

在组件中

created () {
        if (this.$route.params.trade){
          //You can use $route.params.trade to access trade.
          this.model = this.$route.params.trade;
        }

$ router.push刷新页面并丢失数据

2 个答案: