vue组件讲解说明

组件相当于函数,v-bind相当于给这个函数的形参title=“实参post.title”

<div id="app">

  <blog-post v-for="post in posts" v-bind:key="post.id" v-bind:title="post.title" ></blog-post>

</div>

<script>

  Vue.component('blog-post',{

     props: ['title'],

     template: '<h3>{{ title }}</h3>'

  });

  var vm=new Vue({

    el: '#blog-post-demo',

     data: {

      posts: [ { id: 1, title: 'My journey with Vue' }, { id: 2, title: 'Blogging with Vue' }, { id: 3, title: 'Why Vue is so fun' } ]

    }})

</script>

原文地址:https://www.cnblogs.com/alex-13/p/14108209.html