ember.js - 迁移到 Ember 辛烷后出现错误

Question

我正在使用 Ember 3.16.3，并且在以下代码中收到此错误:

Error: Assertion Failed: You must pass a function as the second argument to the on modifier

//login.hbs

 <form {{on "submit" this.login}}>
       <Input type="email" placeholder="email" @value={{this.email}} />
      <button type="submit">login</button>
 </form>

.

//login.js

import Route from '@ember/routing/route';

import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';

export default class LoginRoute extends Route {

   @tracked email = '';

   @action
   login(event) {
     event.preventDefault();

     // do some operations ...
  }
}

Answer 1

根据错误中的指定，on 修饰符应接收要执行的有效函数。正如 guides 中提到的,

If you add the {{action}} helper to any HTML DOM element, when a user clicks the element, the named event will be sent to the template's corresponding component or controller.

这适用于 on 修饰符或模板中使用的任何值。您可以将路由视为我们获取相应页面数据的一部分。任何其他支持属性或计算都必须在 Controller 或组件内定义才能在模板中使用。

因此，将您的 login 操作移至 Controller将解决这个问题。此外，您还需要将电子邮件移至 Controller ，否则您将无法看到其更新正常工作。