假設(shè):

• 需要一個(gè)評(píng)論的模塊comment
• 由于comment在多個(gè)頁(yè)面中可能會(huì)復(fù)用.
• 于是創(chuàng)建一個(gè)comment.vue

步驟:

• 創(chuàng)建comment.vue
• 在需要引用的位置使import comment from '../subcomponent/Comment.vue' 導(dǎo)入子組件
• 在Vue實(shí)例中使用components屬性注冊(cè)
• 注冊(cè)的規(guī)則: “comment-box” : comment (前者是在template中使用的標(biāo)簽名,后者是已經(jīng)寫好的組件名)

創(chuàng)建Comment.vue

<template><div><h3>評(píng)論子組件</h3></div> </template> <script> </script> <style lang = "scss" scoped></style>

導(dǎo)入并使用

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

總結(jié)

以上是生活随笔為你收集整理的vue --- 全局注册子组件,并导入全局的子组件的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。