Introduction à JsRender pour les compétences en syntaxe objet_javascript

Cet article décrit brièvement la syntaxe de base de JsRender pour les objets. Partagez-le avec tout le monde pour votre référence. Les détails sont les suivants :

En tant que moteur de modèle JavaScript, JsRender doit avoir une fonction de boucle, c'est-à-dire for. Cependant, comme JsRender est trop flexible, for peut en fait accepter un objet comme objet de boucle.

{{for Array}} et {{for Object}} sont tous deux autorisés. Tout le monde peut comprendre {{for Array}}, qui consiste à parcourir un tableau et à supprimer chaque élément un par un. Mais {{for Object}} est un peu déroutant, et le document officiel ne donne qu'un exemple inutile sans aucune autre explication.

Au début, Xiaocai pensait que le but de {{for Object}} était de parcourir toutes les propriétés de l'objet, mais après y avoir soigneusement réfléchi, cette fonction {{props Object}} a été implémentée. La balise props consiste à parcourir toutes les propriétés de l'objet. Il y a autant d'attributs qu'il y a de boucles. Chaque boucle aura deux attributs cachés : key et prop Key représentent le nom de l'attribut et prop représente la valeur de l'attribut. à utiliser.

En fait, {{for Object}} n'est pas une boucle. Cela peut être compris comme entrant (Into), ce qui signifie entrer dans l'environnement Object et définir le contexte actuel sur Object, similaire à with dans Handles.js .

Par exemple :

données :

Copier le code Le code est le suivant :

{
"title": "L'équipe A",
"membres": [
          {
"nom": "Pete",
"city": "members_city",
"adresse": {
"ville": "adresse_ville",
"ville1": "adresse_ville1",
"ville2": "adresse_ville2"
>
>
]
>

balisage du modèle :

Copier le code Le code est le suivant :

{{pour les membres}}
{{pour l'adresse}}

.{{:ville}}

{{/pour}}
{{/pour}}

résultat :

Copier le code Le code est le suivant :

adresse_ville

Les résultats montrent que bien qu'il y ait également un attribut city sous l'élément membres, parce qu'il entre dans l'objet pointé par l'adresse via {{for address}}, {{:city}} est obtenu directement à partir de adresse.

En même temps, l'adresse a trois attributs, mais le résultat ne génère qu'une seule ligne, ce qui prouve que {{for Object}} ne boucle pas, il change simplement cela.

J'espère que cet article sera utile à tout le monde pour apprendre la programmation JsRender.