vue中组件通信之父子通信:props(组件传参)

实例一:

<div id="app">
    <alert msg="hhhhhhh"></alert>
</div>
Vue.component('alert', {
    template: '<button @click="on_click">点击</button>',
    props: ['msg'],
    methods: {
        on_click: function(){
            alert(this.msg);
        }
    }
})
new Vue({
    el: '#app'
})

实例二:

<div id="app">
    <user username="samve"></user>
</div>
Vue.component('user', {
    template: `
        <a :href="'user/' + username">{{username}}</a>
    `,
    props: ['username']
})

new Vue({
    el: '#app'
})

猜你喜欢

转载自www.cnblogs.com/samve/p/9124678.html