使用 Stimulus 淡出从 DOM 中删除元素

【问题标题】：Fading out removal of element from DOM with Stimulus使用 Stimulus 淡出从 DOM 中删除元素
【发布时间】：2021-04-04 02:06:38
【问题描述】：

我目前有一个简单的刺激 JS 控制器，它可以从 DOM 中删除一个元素

import { Controller } from "stimulus"
export default class extends Controller {
  static targets = [ "element" ]
    close () {
        this.elementTarget.remove()
    }
}

有没有办法在移除之前淡出元素？

【问题讨论】：

标签： javascript stimulusjs

【解决方案1】：

我有一些东西可以和顺风一起工作。我会保留这个直到找到更通用的解决方案

import { Controller } from "stimulus"
export default class extends Controller {
  static targets = [ "element" ]
    close () {
        this.element.classList.add('transform', 'opacity-0', 'transition', 'duration-1000');
        setTimeout(() => this.elementTarget.remove(), 1000)
    }
}

【讨论】：