component与components使用区别

component是注册全局组件，在实例化VUE前调用，注册后可以全局使用

Vue.component('todo-item',{
  props:['grocery'],
  template:'<li>{{grocery.text}}</li>'
})
var app7 = new Vue({
  el:"#app7",
  data:{
    groceryList:[
      {"id":0,"text":"蔬菜"},
      {"id":1,"text":"奶酪"},
      {"id":2,"text":"其他"}
    ]
  }
})

component在路由中挂载

  {
    path: '/login',
    component: Login
  }

---

components是局部注册组件，注册后只能在当页调用。

var Child = {
  template: '<div>A custom component!</div>'
}
new Vue({
 // ...
  components: {
  // <my-component> 将只在父模板可用
  'my-component': Child
 }
})