Vue组件的引用

父子组件使用

在工程目录/src下创建component文件夹,并在component文件夹下创建一个 firstcomponent.vue并写仿照 App.vue 的格式写一个组件。


 

 

Vue组件的引用_第1张图片

然后在 App.vue 使用组件

第一步,引入。在标签内的第一行写:

import firstcomponent from './component/firstcomponent.vue'

第二步,注册。在标签内的 data 代码块后面加上 components: { firstcomponent }

export default {
  data () {
    return {
      msg: 'Hello Vue!'
    }
  },
  components: { firstcomponent }
}

第三步,使用。在内加上


全局组件

  • 使用更为方便,不需要声明,直接用
  • 在main.js中引入一次并使用Vue.component('组件名', 组件对象)
  • 所有的组件通过组件名使用

你可能感兴趣的:(vue.js,elementui,javascript)