vuejs事件子组件和父组件通信问题

作者: liluchang 分类: vue 发布时间: 2019-03-22 23:11

举例,我们在vue的一个组件中,给组件外发送一个add的事件,那么如何监听这个事件呢?下面用个代码展示

created()
    {
        this.$on('add',()=>{
            alert(11111)
        })
    },
    methods:{
        addStep(){
            axios.post(this.route, {name:this.newStep}).then((res)=>{
                this.$emit('add', res.data.step)
                this.newStep=''
            })
        },
    }

其中我们使用this.$emit()来创建一个事件。

我们可以在created中,用this.$on()来监听这个事件。那么在组件外如何监听呢?代码可以这么写

<step-input :route="route" @add="sync"></step-input>

其中的@add就是监听组件内传来的add事件。@是v-on:的简写。而子组件的事件,不可能用created中的this.$on来监听。

如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!

标签云