Aurelia - Bindungsverhalten
In diesem Kapitel lernen Sie die Verwendung behaviors. Sie können sich das Bindungsverhalten als Filter vorstellen, der die Bindungsdaten ändern und in einem anderen Format anzeigen kann.
Drosseln
Dieses Verhalten wird verwendet, um festzulegen, wie oft ein verbindliches Update stattfinden soll. Wir können benutzenthrottleum die Aktualisierungsrate des Eingabeansichtsmodells zu verlangsamen. Betrachten Sie das Beispiel aus dem letzten Kapitel. Die Standardrate ist200 ms. Wir können das ändern in2 sec beim Hinzufügen & throttle:2000 zu unserem Input.
app.js.
export class App {
constructor() {
this.myData = 'Enter some text!';
}
}
app.html
<template>
<input id = "name" type = "text" value.bind = "myData & throttle:2000" />
<h3>${myData}</h3>
</template>
Entprellen
debounce ist fast das gleiche wie throttle. Der Unterschied besteht darin, dass Debounce die Bindung aktualisiert, nachdem der Benutzer die Eingabe beendet hat. Im folgenden Beispiel wird die Bindung aktualisiert, wenn der Benutzer zwei Sekunden lang nicht mehr tippt.
app.js.
export class App {
constructor() {
this.myData = 'Enter some text!';
}
}
app.html
<template>
<input id = "name" type = "text" value.bind = "myData & debounce:2000" />
<h3>${myData}</h3>
</template>
einmal
oneTimeist das effizienteste Verhalten in Bezug auf die Leistung. Sie sollten es immer verwenden, wenn Sie wissen, dass Daten nur einmal gebunden werden sollten.
app.js.
export class App {
constructor() {
this.myData = 'Enter some text!';
}
}
app.html
<template>
<input id = "name" type = "text" value.bind = "myData & oneTime" />
<h3>${myData}</h3>
</template>
Das obige Beispiel bindet den Text an die Ansicht. Wenn wir jedoch den Standardtext ändern, geschieht nichts, da er nur einmal gebunden wird.