console
Vue.component("my-component", {
props:["text"],
template: "<p><span>{{ text }}</span> <button @click='btnC'>{{ counter }}</button></p>",
data () {
return {
counter: 0
}
},
methods: {
btnC () {
this.counter += 1
this.$emit('increment')
}
}
})
new Vue({
el:"#app",
data: {
total: 0,
msg:[
{text:"第一个"},
{text:"第二个"}
]
},
methods: {
incrementTotal () {
this.total += 1
},
test () {
alert(1)
}
}
})
<div id="app">
<p>{{ total }}</p>
<my-component v-for="todo in msg" v-bind="todo" v-on:click.native="test" v-on:increment="incrementTotal"></my-component>
</div>