假设:

• 需要一个评论的模块comment
• 由于comment在多个页面中可能会复用.
• 于是创建一个comment.vue

步骤:

• 创建comment.vue
• 在需要引用的位置使import comment from '../subcomponent/Comment.vue' 导入子组件
• 在Vue实例中使用components属性注册
• 注册的规则: “comment-box” : comment (前者是在template中使用的标签名,后者是已经写好的组件名)

创建Comment.vue

<template><div><h3>评论子组件</h3></div> </template> <script> </script> <style lang = "scss" scoped></style>

导入并使用

// 父组件 NewsInfo.vue <script> import comment from '../subcomponents/comment.vue';export default {data() {return () {...}},...components: {"comment-box":comment} } </script><template><comment-box></comment-box>\ </template>

总结

以上是生活随笔为你收集整理的vue --- 全局注册子组件,并导入全局的子组件的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。