Exemple d'analyse de liaison de données dans l'applet WeChat (code)

Ce que cet article vous apporte est un exemple d'analyse (code) de liaison de données dans l'applet WeChat. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

1. L'applet WeChat ne peut pas lier la balise dans la page wxml à partir de la page js pour obtenir ou définir la valeur ou l'attribut de la balise. Tous sont implémentés par liaison de données
2. Les données dynamiques dans. WXML provient des données de la Page correspondante.

Liaison de données :
1. Liaison de données simple

wxml中应用双大括号将data中的数据绑定到相应的标签中：
<view> {{ message }} </view>
js中：
Page({
  data: {
    message: &#39;Hello MINA!&#39;
  }
})

2. Liaison des attributs d'étiquette

wxml中，其中绑定的要在双引号之中：
<view id="{{id}}"> </view>
js中:
Page({
  data: {
    id: 0
  }
})

3. des attributs de contrôle

wxml中（绑定在双引号中）
<view wx:if="{{condition}}"> </view>
//作为条件句出现，可以动态决定某一个标签出现不出现
js中：
Page({
  data: {
    condition: true
  }
})
---或---
wxml中（绑定在双引号中）
<view hidden="{{condition}}"> </view>
//作为条件句出现，可以动态决定某一个标签出现不出现
js中：
Page({
  data: {
    condition: true
  }
})
//hidden与wx:if的区别：
hidden只是隐藏，但是节点是生成的
wx:if不生成节点

4. Mots clés (doivent être entre guillemets doubles)

true：boolean 类型的 true，代表真值。

false： boolean 类型的 false，代表假值。

<checkbox checked="{{false}}"> </checkbox>
特别注意：不要直接写 checked="false"，其计算结果是一个字符串，转成 boolean 类型后代表真值。
//在新版的微信小程序开发工具中，这个问题好像被解决了，即checked="true"也是对的

5. Opération

1>三元运算

<view hidden="{{flag ? true : false}}"> Hidden </view>

2>算数运算

<view> {{a + b}} + {{c}} + d </view>
Page({
  data: {
    a: 1,
    b: 2,
    c: 3
  }
})
view中的内容为 3 + 3 + d。

3>逻辑判断

<view wx:if="{{length > 5}}"> </view>

4>字符串运算

<view>{{"hello" + name}}</view>
Page({
  data:{
    name: &#39;MINA&#39;
  }
})

5>数据路径运算

<view>{{object.key}} {{array[0]}}</view>
Page({
  data: {
    object: {
      key: &#39;Hello &#39;
    },
    array: [&#39;MINA&#39;]
  }
})

//综上：
所有运算都是在{{}}之中进行的，这时候里面就相当于一些语言代码，而不是要呈现的内容

6. Combinaison (pas très commun, je n'entrerai donc pas dans les détails ici. Si nécessaire, reportez-vous au document de développement du programme WeChat Mini, section Liaison de données)

Recommandations associées :

Dans le programme WeChat Mini. Processus d'analyse personnalisé des données

Explication détaillée de l'utilisation d'iconfont dans le mini programme WeChat (avec code)

Exemple de mini programme WeChat : mise en œuvre Code de vérification aléatoire (avec code)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!