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

鍍金池/ 問答/HTML/ Vue中的組件中引用組件怎么寫

Vue中的組件中引用組件怎么寫

本人接觸vue不久,我想問下在VUE父組件引入子組件怎么不生效啊
App.vue 父組件

<template>
  <div id="app">
    <Header></Header>
    <router-view/>
  </div>
</template>

<script>
import Header from './components/header.vue'
export default {
  name: 'App',
  component:{
    Header
  }
}
</script>

header.vue 子組件


<template>
  <el-header>{{title}}</el-header>
</template>

<script>
export default {
  name: 'header',
  data(){
    title:"標(biāo)題"
  }
}
</script>

也沒用報(bào)錯(cuò),只是haeder沒有顯示出來,是哪里寫錯(cuò)了嗎

回答
編輯回答
有點(diǎn)壞

換個(gè)名字,不要用header,vue以為你用的是html標(biāo)準(zhǔn)里的header

2017年7月28日 18:11
編輯回答
怣痛

自己研究出來了 原來那個(gè)template里面的組件標(biāo)簽可以隨便寫,問了交流群里面的朋友,說這個(gè)是vue自己去處理的,雖然我還沒有理解到底是什么原理
附上正確的代碼

<template>
  <div id="app">
    <header-component></header-component>
    <router-view/>
  </div>
</template>

<script>
import headerComponent from './components/header.vue'
export default {
  name: 'App',
  components:{headerComponent}
}
</script>

據(jù)說vue是自己去拆分我命名的 headerComponent變量,是這樣么?

2018年3月7日 06:17
編輯回答
悶油瓶
data () {
    return {
      title: '標(biāo)題'
    }
  }

沒報(bào)錯(cuò)是因?yàn)槟銢]裝eslint檢查代碼風(fēng)格

2017年9月30日 12:51