- 在
Vue
组件中定义需要引用的子组件。例如:// 子组件 Vue.component('my-component', { template: '<div>A custom component!</div>' })
- 在父组件中引用该子组件。例如:
// 父组件 new Vue({ el: '#app', template: '<div><my-component></my-component></div>' })
在这个例子中,我们定义了一个
my-component
组件,并在父组件的模板中使用了这个组件。当父组件被渲染时,它将引用并显示my-component
组件。注意:如果你使用了 Vue 单文件组件(
.vue
文件),则可以使用import
来引入组件。例如:import myComponent from './myComponent.vue' export default { components: { 'my-component': myComponent } }
这个例子中,我们使用
import
引入了单文件组件myComponent.vue
,然后将其作为子组件的引用方式添加到父组件的components
选项中。然后,你就可以在父组件中使用my-component
标签来引用和显示这个组件了。
vue如何引用组件
猜你喜欢
转载自blog.csdn.net/qq_19820589/article/details/131015186
今日推荐
周排行