vue组件


vue组件就是可复用的vue实例，即为可重复使用的模板


<body>


<div id="app">
  <kaka></kaka>
</div>

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
<script>
//定义一个vue组件
Vue.component("kaka",{
    template: '<li>hello</li>'
});

var mv=new Vue({
  el: '#app'

});
</script>

</body>





<body>


<div id="app">
  <kaka v-for="item in items" v-bind:k="item"></kaka>
</div>

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
<script>
//定义一个vue组件
Vue.component("kaka",{
    props: ['k'],
    template: '<li>{{k}}</li>'
});

    var mv=new Vue({
      el: '#app',
      data: {
        items: ["gogo","fafa","hehe"]
      }
    });
</script>

</body>





posted @ 2022-03-03 21:45  卡卡发  阅读(31)  评论(0)    收藏  举报