useClickOutside重复调用导致多次绑定事件

首页课程实战体系课手记专栏慕课教程

useClickOutside重复调用导致多次绑定事件

来源：4-11 useClickOutside 第一个自定义函数

津白

2020-11-27

可能是因为dropdownRef的值改变的缘故吧，useClickOutside会被调用两次，导致有两个不同的handler会被绑定在click事件上。如果在useClickOutside 内的 handler中打印console.log('isClickOutside', isClickOutside.value)然后再点击UI会发现一次点击可以log出两个不同的value。当然后绑定的handler是我们想要的操作，所以不会影响UI，但是想请问如何可以优雅的解决重复绑定的这个问题。

写回答

1回答

张轩

2020-11-28

已采纳

同学你好请问你的代码是怎样写的呢？我这里使用以后 handler 只会被调用一次，也就是 onMounted 的时候被添加一次。请提供代码看一下

0

1

津白

实在抱歉老师，是我弄错了！之前打印两次是因为我在另一个组件中也用了useClickOutside...

2020-11-30

共1条回复

Vue3 + TS 仿知乎专栏企业级项目

带你完成前后端分离复杂项目，率先掌握 vue3 造轮子技能

3209 学习 · 2364 问题

相似问题

回答 1

使用volar验证TS useClickOutside参数类型错误

回答 2

Modal组件复用useClickOutside遇到的问题

回答 1

为什么要使用unmounted

回答 1

context.emit('close-message', true)

回答 1

打开慕课网App查看更多内容