代码之家  ›  专栏  ›  技术社区  ›  J Weezy

Ember Octane注销按钮消失

  •  0
  • J Weezy  · 技术社区  · 4 年前

    我正在升级到Ember Octane,并修改了模板HBS以调用组件JS。当我使用Ember Classic时,注销按钮存在并工作。但是,当我转换为辛烷值时,注销按钮就会消失。o_o

    在HBS模板上显示注销按钮的正确方式是什么?注意:我没有组件HBS文件。Ember Octane中需要这个吗?

    经典模板HBS代码片段:

    <li><a href="#" onclick={{action "logout"}}>Logout</a></li>
    

    辛烷模板HBS代码段:

    <li><a href="#" onclick={{on "submit" this.logout}}>Logout</a></li>
    

    Octane Component JS(适用于经典模板,但不适用于Octane模板):

    import Component from '@ember/component';
    import { inject as service } from '@ember/service';
    import { action } from '@ember/object';
    
    export default class Navigation extends Component {    
    
        @service session
        @service currentClient
    
        @action
        logout(ev) {
    
            ev.preventDefault();
    
                this.session.invalidate();
        }
    }
    
    0 回复  |  直到 4 年前
        1
  •  3
  •   Gokul Kathirvel    4 年前

    这里的问题是使用不当 on 改性剂。这个 修饰符必须在元素空间上使用,而在代码段中 修饰符被用作助手。

    应该像这样使用:

    <button {{on "click" this.logout}}> Logout </button>
    

    这意味着,我们要求框架注册提供的函数 this.logout 对于 click 活动。

    如:

    <button onclick={{on "click" this.logout}}> Logout </button>
    

    This guide 应该有助于从经典的事件处理迁移到最新的Octane方式。