Question

我该如何调用语义UI的功能来关闭和淡化图标单击时的消息？

https://semantic-ui.com/collections/message.html#dismissable-block有一个jQuery调用（？），但我不确定在vue中如何处理类似的事情。有人可以解释它在做什么吗？我知道您正在传递要单击的函数，但是函数中的$（'。message .close'）和$（this）是什么？

<i class="close icon" @click=???? >

$('.message .close')
  .on('click', function() {
    $(this)
      .closest('.message')
      .transition('fade')
    ;
  })
;

Answer 1

$（'。message .close'）是一个jQuery类选择器，它将从您的html元素中选择.message和.close类。$（this）将是它找到的dom元素，您可以使用以下代码，包括html中的CDN以及jQuery的CDN。

Answer 2

在发布此内容之前，我真的应该查找文档。感谢您整理内容，我对CSS类与函数调用之间的差异感到困惑。使用过渡包装器和v-if完成了工作。

https://vuejs.org/v2/guide/transitions.html#Transitioning-Single-Elements-Components

Vue.js如何将点击功能设置为语义UI的关闭功能？

2 个答案: