Vue 中prop的使用

<div id="app">
            <button-counter  v-for="item in todos" :my-title="item.text">
            </button-counter>
        </div>
        <script type="text/javascript">
            // 作用域插槽
            Vue.component('button-counter', {
              data: function () {
                return {
                  count: 0
                }
              },
              props:['myTitle'],
              template: '<button v-on:click="count++">{{myTitle}}---You clicked me {{ count }} times.</button>'
            })
            var app = new Vue({
                el: "#app",
                data: {
                    name: "岔道口",
                    todos: [{
                            text: "A",
                            id: 1,
                            isTrue: true
                        },
                        {
                            text: "B",
                            id: 2,
                            isTrue: true
                        },
                        {
                            text: "C",
                            id: 3,
                            isTrue: false
                        },
                        {
                            text: "D",
                            id: 4,
                            isTrue: true
                        },
                    ],
                },



            })
        </script>