admin 管理员组

文章数量: 887021


2024年1月5日发(作者:简单的python爬虫代码)

vue引用组件方式

Vue 引用组件的方式有两种:全局引用和局部引用。

1. 全局引用:

在主入口文件(如 )中使用 Vueponent() 全局注册组件,然后就可以在任何组件中使用该组件。

javascript

import Vue from 'vue'

import App from './'

import MyComponent from './'

Vueponent('my-component', MyComponent)

new Vue({

render: h => h(App),

}).mount('#app')

html

2. 局部引用:

在需要引用组件的组件中,通过 import 导入组件,然后在 components 选项中注册该组件。

javascript

import MyComponent from './'

export default {

components: {

'my-component': MyComponent

},

...

}

html

需要注意的是,在使用局部引用时,组件名需要使用 kebab-case(短横线分隔命名)而不是 PascalCase,因为模板中的组件名是大小写不敏感的。而在全局引用中,组件名是大小写敏感的,可以使用 PascalCase 或 kebab-case。


本文标签: 组件 引用 全局 横线