Question

我添加了一个文本框，我想在每个keyup函数上都应该这样做。

这是我的html代码：

<input type="text" id="description" class="form-control" maxlength="255" data-bind="event:{keyup: doSomething},value: property1,valueUpdate:'afterkeyup'"></input>

这是我的剔除js代码：

define(['uiComponent','ko'], function(Component,ko) {
         return Component.extend({
            defaults:{
                property1: ko.observable(),
                tracks: {
                        property1: true
                  }
            },
            initialize: function () {
                this._super();
            },
            getText: function () {
                return "call the function here..";
            },
            doSomething : function(){
                this.property1.subscribe(function(newValue){
                    console.log(newValue);
                    console.log("inside subscribe");
                });
            }
        });
});

例如：当我按“ T”键时，它将通话一次。之后，我按“ E”键，它将调用2次而不是1次。

我想在每个要获取文本框值的键盘上都这样做。

该怎么做？

Answer 1

具有两种方式绑定和订阅事件是一种“反模式”。

在initialzie中，为您的可观察对象创建一次订阅：

initialize: function() {
  /* ... */
  this.property1.subscribe(function(newValue) { /* ... */ });
}

如果您打算以后删除该组件，则可以存储订阅并在删除后将其处置。（类似于您当前在每个事件中所做的事情。）

现在，每当发生keyup时，敲除操作都会从输入中读取value，将其写入property1，然后调用订阅的函数。

Answer 2

最后，我找到了解决方案：

我喜欢一种可能的解决方法是在调用订阅时存储返回的 subscription 对象，如果存在已存储的 subscription ，请处置 strong>，然后再次订阅。

define(['uiComponent','ko'], function(Component,ko) {
         return Component.extend({
            defaults:{
                property1: ko.observable(),
                subscription : null,
                tracks: {
                        property1: true
                  }
            },
            initialize: function () {
                this._super();
            },
            getText: function () {
                return "call the function here..";
            },
            doSomething : function(){
                if (this.subscription)
                    this.subscription.dispose();

                this.subscription = this.property1.subscribe(function(newValue){
                    console.log(newValue);
                    console.log("inside subscribe");
                });
            }
        });
});

淘汰JS：函数调用两次

2 个答案: