在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue的父子組件和局部全局組件有什么區(qū)別?

vue的父子組件和局部全局組件有什么區(qū)別?

我只知道全局組件和局部組件 不知道什么是父子組件 手冊(cè)也沒有介紹 網(wǎng)上的教程也沒有說什么是父組件和子組件 直接就講了父子通信和父子傳值之類的東西 剛看到組件這里 感覺很困惑 哪位大神能給解釋一下父子組件呢?

回答
編輯回答
涼心人

全局組件,顧名思義,到處都存在。定制性低,擴(kuò)展性強(qiáng)。

局部組件,就是某處,例如 <page-a> 組件的 script 內(nèi),引入外部組件 <list> 后才存在于該組件內(nèi)的組件。
一些不想到處使用的組件,就用局部組件。這種組件定制性高,擴(kuò)展性差,一般是二次封裝的專供該頁面使用的組件。
2017年10月10日 17:04
編輯回答
笑忘初

@Zany
我是新手,很感謝您能回復(fù)我,或許是我官方教程看的不夠仔細(xì),還是不太理解您的回答,請(qǐng)看下面的例子。

<div id="app-4">
     <div id="app-5" :style="{ fontSize: postFontSize + 'em' }" >
        <blog-post3 v-for="post in posts" v-bind:post="post" v-bind:key="post.id" v-on:enlarge-text="postFontSize += 0.1 "> </blog-post3>
    </div>
</div>

<script>
    Vue.component('blog-post3', {
       props: ['post'],
       template: `
        <div>
            <h3> {{ post.title }}</h3>
            <button v-on:click="$emit('enlarge-text')">enlarge text</button>
            <div v-html="post.content"></div>
        </div>`
    });
    var app4 = new Vue({
      el: '#app-4',
      data: {
        posts: [
          { id: 1, title: 'My journey with Vue', content: '...content...' },
          { id: 2, title: 'Blogging with Vue', content: '...content...' },
          { id: 3, title: 'Why Vue is so fun', content: '...content...' }
        ],
        postFontSize: 1
      }
    });
</script>

以這個(gè)例子來說,是否可以理解為:app-4實(shí)例化后<div id="app-4"> 是父組件, <blog-post3>是其子組件.
如果不對(duì)的話,請(qǐng)問您說的div所在的組件是什么?

2018年9月2日 11:42
編輯回答
傲寒

就是在組件里面使用另外一個(gè)組件,就形成了父子關(guān)系

例如在component1中使用component2
component1就是component2的父組件
component2就是component1的子組件

//component1.vue
<template>
   <div>
        <component2></component2>
   </div>
<template>
...
import component2 from 'component2.vue'
2017年7月24日 15:12