vue(三)—组件与组件的拆分

• 组件分为全局组件和局部组件，每个vue的组件都是vue实例，每个vue实例也都是组件， 组件定义后就可以多次的拿来当模板用
• 每个组件里面都有一个模板属性template,data属性，methods属性，以及传参的属性props等，而最大的组件即Vue实例没有将template属性写出来时它默认的是template的值是它所绑定的挂载点下的所有内容

1、全局组件

用法如下：

 <div id='block_1'>
      <input v-model:value = 'msg'/>
      <input type = 'submit' @click = 'handleClick'/>
      <do-list v-for='(item,index) of arr' :key = 'index' :item = 'item'></do-list>//将下面定义的do-list组件拿来用
  </div>
  <script>
    //全局组件
    Vue.component('do-list',{
        props:['item'],
        template:'<li>{
  {item}}</li>'
    });

      new Vue({
          el:'#block_1',
          data:{
              msg:'',
              arr:[]
          },
          methods:{
              handleClick:function() {