当前位置: 首页 > 文档资料 > EmberJS 入门教程 >

允许修改键(Allowing Modifier Keys)

优质
小牛编辑
130浏览
2023-12-01

您可以使用allowedKeys选项允许修饰键和{{action}}助手一起使用。 有时, {{action}}帮助器会使用按下的修改键来丢弃单击事件。 因此, allowedKeys选项指定不应忽略哪些键。

语法 (Syntax)

<button {{action 'action-name' allowedKeys = "alt"}}></button>

例子 (Example)

下面给出的示例显示了{{action}}帮助程序上allowedKeys选项的用法。 创建一个新组件,并使用以下代码将其命名为post-action.js -

import Ember from 'ember';
export default Ember.Component.extend ({
   actions: {
      //toggling the text
      toggleBody: function () {
         this.toggleProperty('isShowing');
      }
   }
});

使用以下代码打开在app/templates/下创建的post-action.hbs文件 -

<button {{action "toggleBody" on = 'click' allowedKeys = "alt"}}>{{title}}</button>
{{#if isShowing}}
<h2>Welcome to xnip</h2>
{{/if}}
{{outlet}}

现在使用以下代码打开在app/templates/下创建的application.hbs文件 -

{{post-action title = "Click Me"}}
{{outlet}}

输出 (Output)

运行ember服务器; 你会收到以下输出 -

Ember.js模板动作修改键

现在,您单击按钮, {{action}}帮助器触发器以及allowedKeys选项以允许修改键 -

Ember.js模板动作修改键