vue怎么實(shí)現(xiàn)本項目頁面之間跳轉(zhuǎn)

這篇“vue怎么實(shí)現(xiàn)本項目頁面之間跳轉(zhuǎn)”文章的知識點(diǎn)大部分人都不太理解，所以小編給大家總結(jié)了以下內(nèi)容，內(nèi)容詳細(xì)，步驟清晰，具有一定的借鑒價值，希望大家閱讀完這篇文章能有所收獲，下面我們一起來看看這篇“vue怎么實(shí)現(xiàn)本項目頁面之間跳轉(zhuǎn)”文章吧。

本項目頁面之間跳轉(zhuǎn)方式

在template模板中添加

button按鈕加入click事件

<el-button type="primary" @click="func()">添加試題</el-button>

在methods中寫入路徑

func() { 
      this.$router.push({ path: "add-question" }); 
    },

修改路由文件

加入所有跳轉(zhuǎn)的本地界面

vue解決頁面跳轉(zhuǎn)問題

問題描述：兩個不同的頁面，進(jìn)行帶參數(shù)跳轉(zhuǎn)

解決辦法

1、需要跳轉(zhuǎn)的頁面，創(chuàng)建跳轉(zhuǎn)方法。

//@click="PageJump(scope.row)"
 
//具體如下：
<el-table-column label="跳轉(zhuǎn)頁面" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="PageJump(scope.row)"
          >點(diǎn)擊跳轉(zhuǎn)</el-button>
        </template>
</el-table-column>
PageJump(row) {
      this.$router.push({
        path: "/頁面/具體/路徑/" + row.id,
        params: {
          id: row.id
        }
      });
    }

2、配置路由（一般是router.js文件）

{
    path: '/文件目錄路徑',
    component: Layout,
    hidden: true,
    children: [
      {
        path: 'PageJump/data/:OtherId(\\d+)',
        component: (resolve) => require(['@/views/跳轉(zhuǎn)到的頁面路徑/index'], resolve),
        name: 'PageJump',
        meta: { title: '跳轉(zhuǎn)到的頁面', icon: '' }
      }
    ]
}

按照這樣基本可以完成帶參數(shù)的頁面跳轉(zhuǎn)。 

以上就是關(guān)于“vue怎么實(shí)現(xiàn)本項目頁面之間跳轉(zhuǎn)”這篇文章的內(nèi)容，相信大家都有了一定的了解，希望小編分享的內(nèi)容對大家有幫助，若想了解更多相關(guān)的知識內(nèi)容，請關(guān)注億速云行業(yè)資訊頻道。