鍍金池/ 問答/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:"標題"
  }
}
</script>

也沒用報錯,只是haeder沒有顯示出來,是哪里寫錯了嗎

回答
編輯回答
有點壞

換個名字,不要用header,vue以為你用的是html標準里的header

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

自己研究出來了 原來那個template里面的組件標簽可以隨便寫,問了交流群里面的朋友,說這個是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: '標題'
    }
  }

沒報錯是因為你沒裝eslint檢查代碼風(fēng)格

2017年9月30日 12:51