Datenbindung
Die dynamischen Daten in WXML stammen aus den Daten der entsprechenden Seite.
Einfache Bindung
Die Datenbindung verwendet die „Mustache“-Syntax (doppelte Klammern), um Variablen einzuschließen, die angewendet werden können auf:
Inhalt
< view> {{ message }}
Page({ data: { message: 'Hello MINA!' } })
Komponenteneigenschaften (müssen in doppelten Anführungszeichen stehen)
Page({ data: { id: 0 } })
Steuerattribute (müssen in doppelten Anführungszeichen stehen)
Page({ data: { condition: true } })
Operation
kann einfache Operationen innerhalb von {{}} ausführen. Die folgenden Methoden werden unterstützt:
Ternäre Operationen
Rechenoperationen
< view> }} + {{c}} + d
Page({ data: { a: 1, b: 2, c: 3 }
Der angezeigte Inhalt ist 3 + 3 + d
Logisches Urteil
< view wx="{{length > 5}}">
String-Operationen
Page({ data:{ name:"MINA" } })
Kombination
kann auch direkt in Mustache zu einem neuen Objekt oder Array kombiniert werden
Array
Page({ data: { zero: 0 } })
Endlich zu einem Array zusammengefasst [ 0, 1, 2, 3, 4]
Objekt
<template is="objectCombine" data="{{for: a, bar: b}}"></template> Page({ data: { a: 1, b: 2 } })
Das endgültige kombinierte Objekt ist {für: 1, Balken: 2}
Sie können auch verwenden der Spread-Operator... um ein Objekt zu erweitern
<template is="objectCombine" data="{{...obj1, ...obj2, e: 5}}"></template> Page({ data: { obj1: { a: 1, b: 2 }, obj2: { c: 3, d: 4 } } })
Das endgültige kombinierte Objekt ist {a: 1, b: 2, c: 3, d: 4 , e: 5} Das endgültige kombinierte Objekt ist {foo: 'my-foo', bar: 'my-bar'🎜>
Wenn der Schlüssel und der Wert des Objekts gleich sind, kann er auch indirekt ausgedrückt werdenPage({
data: {
foo: 'my-foo',
bar: 'my-bar'
}
})
Hinweis: Die obige Methode kann nach Belieben kombiniert werden , aber wenn es dieselben Variablennamen gibt, überschreiben die letzteren die vorherigen, wie zum Beispiel Page({
data: {
obj1: {
a: 1,
b: 2
},
obj2: {
b: 3,
c: 4
},
a: 5
}
})