为属性的更改处理没有名字

Question

考虑以下列表：

fields.html

<div repeat.for="f of fields"> 
    ${f.name}: <input value.bind="f.value"> 
</div> 

fields.js

class Fields 
{ 
    fields = [{ 
     name: "First name", 
     value: "Jack" 
    }, { 
     name: "Surname", 
     value: "Giant slayer" 
    }]; 
} 

我想保存列表一旦它改变了（也许在几秒钟后，像油门一样）。我怎样才能在Fields类中引入一个处理程序，以便在文本框被更改后调用它？我不是在谈论blur事件处理程序。

Answer 1

保存在DOM input事件。使用debounce绑定行为对保存进行速率限制。

下面是一个例子：https://gist.run?id=26ea2f5e3a2c35ecd96ff9aa579a893f

app.html

<template> 
    <form input.delegate="save() & debounce:500"> 
    <label repeat.for="f of fields"> 
     ${f.name}: <input value.bind="f.value"> 
    </label> 
    </form> 

    <pre><code>${log}</code></pre> 
</template> 

app.js

export class App { 
    fields = [ 
    { name: "First name", value: "Jack" }, 
    { name: "Surname", value: "Giant slayer" } 
    ]; 

    log = ''; 

    save() { 
    this.log += `Saved: ${JSON.stringify(this.fields)}\n`; 
    } 
}