公共操作
-
src下新建components資料夾
-
在components資料夾下新建你所需要的元件
Zujian-name.vue
複製程式碼
- 在Zujian-name.vue元件中可使用 ‘sc’ 快速生成模板
在需要使用元件的頁面中註冊元件
- 需要使用元件的頁面中引入
import Zujian-name from '@/component/Zujian-name'
複製程式碼
- 在頁面中註冊元件
export default {
name: 'Home',
components: {
Zujian-name
}
}
複製程式碼
- 在需要的位置使用元件
<Zujian-name></Zujian-name>
複製程式碼
在Router中全域性使用元件
- 在routes.js中引入元件
import Zujian-name from '@/component/Zujian-name'
複製程式碼
- 在需要元件的路由中配置components項
{
path: '/home',
name: 'home',
components: {
default: Home,
Zujian-name: Zujian-name //表示Home頁面需要此元件
}
}
複製程式碼
- 在全域性(App.vue)中新增佔位符,為元件留位置
<router-view name="Zujian-name"/>
複製程式碼