Javascript 如何在Vuejs中单击外部时关闭li标记？

单击外部：0，
方法：{
外部：功能（e）{
此选项。单击外部+=1
//eslint禁用下一行
console.log（'在外部单击！'）
},
指令：{
“单击外部”：{
绑定：函数（el、绑定、vNode）{
//提供的表达式必须计算为函数。
if（binding.value的类型！=='function'）{
const compName=vNode.context.name
让warn=`[Vue单击外部：]提供的表达式“${binding.expression}”
不是一个函数，但必须是`
如果（compName）{warn+=`在组件${compName}'中找到`}
//eslint禁用下一行
控制台。警告（warn）
}
//定义处理程序并将其缓存在元素上
常量气泡=binding.modifiers.bubble
常量处理程序=（e）=>{
if（气泡| |（！el.contains（e.target）&&el！==e.target））{
绑定值（e）
}
}
//eslint禁用下一行
el.\uuuu Vueclickkoutside\uuuuuu=handler
//添加事件侦听器
document.addEventListener（'click'，handler）
},
解除绑定：函数（el，绑定）{
//删除事件侦听器
//eslint禁用下一行
document.removeEventListener（'click'，el.\uu vueclickkoutside\uuu）
//eslint禁用下一行
el.\uuuu Vueclickkoutside\uuuuu=null
}
}
}

{{item}}

这里确实有@linus borg提出的

v-click-out

：

附加一个函数，该函数将在每次单击所附加的元素之外的任何位置时触发

更新：

据我所见，您在组件中定义了一个函数

外部

，在这里您可以控制是否显示下拉列表

导出默认值{
/* ... */
方法：{
外（）{
this.showSearchHistory=false；
},
},
/* ... */
};

谢谢，查看了您提供的JSFIDLE代码。并更新了上面的代码。现在，当在li之外单击时，它正在计算值。但是，当在li之外单击时，我需要关闭li。函数

outside

需要使用

showSearchHistory=false关闭可见性