javascript - RiotJS onclick 加载时触发

Question

我正在使用 RiotJS 编写一个表应用程序，但在 onclick 事件上我一直遇到同样的问题。几乎每次我尝试使用

<tag onclick={somefunction}>

我的行为非常不稳定。有时，它会在页面加载或更新时多次调用该函数，然后根本不响应点击，有时它会在启动时触发多次。我似乎无法找出问题背后的模式，尽管我注意到这往往是内联函数调用的问题，例如

<tag onclick={console.log("foo")}>

并且很少使用引用传递 <tag onclick={function}>尽管两者都会发生。有人经历过这样的事情吗？如果您需要更多背景信息，请发表评论。

Answer 1

在 Riot 中 {}表达式在安装/更新时计算。

这意味着如果 {} 里面有什么是一个函数调用，当安装的标签更新时，每次评估它所在的部分时，都会执行它。

这与普通的 javascript 不同，在普通的 javascript 中，在单击该内容之前，甚至不会解析 onclick。

这可能会导致一些困惑，因为 Riot 并不总是解析 {}表达你的想法。这对于复合表达式(具有 bool 逻辑 || 和 && 等)尤其麻烦。

在本例中，onclick在 Riot 中正在寻找一个表达式/函数...并且它将尝试根据标签本身对其进行评估...换句话说，这是:

<button onclick={foobar}>Click me!</button>

Riot 将尝试执行 this.foobar()单击时。

通常，我尝试通过在 <script> 中设置我的方法来利用这一点。标签的一部分。这使得误解我的 {} 的空间很小。表达式，并将逻辑位从标记的 HTML 部分移至我期望的行为所在的脚本部分。