关于Vue2组件适配迁移到Vue3的坑（持续更新）

最新推荐文章于 2024-05-11 14:26:06 发布

绒球帽

最新推荐文章于 2024-05-11 14:26:06 发布

阅读量630

点赞数

分类专栏：前端开发 js vue 文章标签：前端 vue.js javascript

本文链接：https://blog.csdn.net/BobbleHat/article/details/117123515

版权

前端开发同时被 3 个专栏收录

21 篇文章 0 订阅

订阅专栏

vue

8 篇文章 0 订阅

订阅专栏

6 篇文章 0 订阅

订阅专栏

@click触发的逻辑有修改

vue2中的子组件默认不会冒泡到父组件，所以类似于@click的方法需要在子组件内被手动返回，vue3中修复了这个bug，vue2组件的这部分需要被修改下

// vue 2中

// 子组件
<template>
    <div @click="testClick">
        ...
    </div>
</template>

<script>
    ...
    methods: {
        testClick () {
            this.$emit('click')
        }
    }
</script>


//父组件
<template>
    <子组件 @click="test">点击</子组件>
</template>





/** vue2 需要这种方式才可以在父组件内触发点击子组件的方法 其他onXXXX方法同理*/

而在vue3中copmsition api写法不需要在子组件返回子组件事件，直接在父组件正常@click即可，否则会重复触发两次绑定的方法