将函数传递给刺激

问题描述

我一直在为我的最新项目使用刺激，我喜欢如何将代码分解和模块化为小的可重用部分。

然而，有时生成一个新的控制器并将其作为元素属性放置是有点麻烦的，只是为了给它一个特定的功能。

我不知道是否可以创建一个通用控制器并传递给它一个函数或回调来执行。所以我仍然可以保持精简和干净的代码

解决方法

Stimulus 很棒的原因之一是它或多或少只是 Javascript。因此，您可以在通用 Stimulus 控制器上拥有一个大致如下所示的方法：

  execute() {
    let fname = this.element.getAttribute("data-method")
    // put this in a file somewhere else
    let myFunctionMap = {
      "scroll": () => {
        // just a plain fn
      },"otherThing": () => {}
    }
    return myFunctionMap[fname]()
  }

这将允许您在 HTML 中有一个像这样的按钮：

      <button
        class="button button-primary"
        data-action="generic#execute"
        data-method="scroll">
        Do the thing
      </button>

不像普通的JS那么简单，但非常接近。