通常，我們點頁面上的詳情，或者編輯，需要加載一個新的頁面出來。

vue中加載頁面的方法：

在父頁面中（通常是某個模塊目錄下的index.vue），先寫這行代碼：

import AddEditForm from './addOrEditForm'

./addOrEditForm 是當前目錄下的 addOrEditForm.vue?文件。

AddEditForm 是自定義的名字。

組件名需要根據?AddEditForm 此名字來定義，即：<add-edit-form></add-edit-form>。

通常會加上一些屬性：

<add-edit-form v-if="isShow" @closeForm="closeAddEditForm" :id="id" :isEdit="isEdit"></add-edit-form>

上面這行組件代碼也是寫在父頁面中，通過點擊頁面上的按鈕，調用方法，將isShow設置為true，便加載了新的頁面。

例如：

<template>
<div>
<p-button type="link" @click="goToDetail(item)">詳情</p-button>
</div>
</template>

    goToDetail(args) {this.dataId = args.idthis.isEdit = 'detail'this.isShow = true},edit(args) {this.dataId = args.idthis.isEdit = 'edit'this.isShow = true},

參考：

Vue項目中常用的兩種頁面轉換方法_refreshdatalist-CSDN博客