国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

微信小程序中WXML模版語(yǔ)法-數(shù)據(jù)綁定方法介紹

這篇具有很好參考價(jià)值的文章主要介紹了微信小程序中WXML模版語(yǔ)法-數(shù)據(jù)綁定方法介紹。希望對(duì)大家有所幫助。如果存在錯(cuò)誤或未考慮完全的地方,請(qǐng)大家不吝賜教,您也可以點(diǎn)擊"舉報(bào)違法"按鈕提交疑問(wèn)。

微信小程序中WXML模版語(yǔ)法-數(shù)據(jù)綁定方法介紹

1.數(shù)據(jù)綁定的基本原則

1>在data中定義數(shù)據(jù)

2>在WXML中使用數(shù)據(jù)

2.在data中定義頁(yè)面的數(shù)據(jù)

在頁(yè)面對(duì)應(yīng)的.js文件中,把數(shù)據(jù)定義到data對(duì)象中即可:

page({
	data:{
		info:'init data'
	}
})

3.Mustache語(yǔ)法的格式

把data中的數(shù)據(jù)綁定到頁(yè)面中渲染,使用Mustache語(yǔ)法(雙大括號(hào))將變量包起來(lái)即可。語(yǔ)法格式為:

<view>{{info}}</view>//雙括號(hào)中放入你想導(dǎo)入的數(shù)據(jù)

4.Mustache語(yǔ)法的應(yīng)用場(chǎng)景

Mustache語(yǔ)法的主要應(yīng)用場(chǎng)景為:

1>綁定內(nèi)容

2>綁定屬性

3>運(yùn)算(三元運(yùn)算、算術(shù)運(yùn)算等)

5.動(dòng)態(tài)綁定屬性

頁(yè)面的數(shù)據(jù)如下:

page({
	data:{
		imgSrc:'www.demo.com'
	}
})

頁(yè)面的結(jié)構(gòu)如下:

<image src="{{imgSrc}}"></image>

6.三元運(yùn)算

頁(yè)面的數(shù)據(jù)如下:

page({
	data:{
		randomNum:Math.random()*10 //生成10以內(nèi)的隨機(jī)數(shù)
	}
})

頁(yè)面的結(jié)構(gòu)如下:

<view>{{ randomNum >= 5 ? '隨機(jī)數(shù)字大于等于5' : '隨機(jī)數(shù)字小于等于 5'}}</view>

7.算術(shù)運(yùn)算

讓頁(yè)面的數(shù)據(jù)如下:

page({
	data:{
		randomNum:Math.random().toFixed(2) //生成一個(gè)帶兩位小數(shù)的隨機(jī)數(shù),例如 0.34
	}
})

頁(yè)面的結(jié)構(gòu)如下:文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-658024.html

<view>生成100以內(nèi)的隨機(jī)數(shù):{{ randomNum * 100}}</view>

到了這里,關(guān)于微信小程序中WXML模版語(yǔ)法-數(shù)據(jù)綁定方法介紹的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!

本文來(lái)自互聯(lián)網(wǎng)用戶投稿,該文觀點(diǎn)僅代表作者本人,不代表本站立場(chǎng)。本站僅提供信息存儲(chǔ)空間服務(wù),不擁有所有權(quán),不承擔(dān)相關(guān)法律責(zé)任。如若轉(zhuǎn)載,請(qǐng)注明出處: 如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實(shí)不符,請(qǐng)點(diǎn)擊違法舉報(bào)進(jìn)行投訴反饋,一經(jīng)查實(shí),立即刪除!

領(lǐng)支付寶紅包贊助服務(wù)器費(fèi)用

相關(guān)文章

  • 微信小程序:tabbar、事件綁定、數(shù)據(jù)綁定、模塊化、模板語(yǔ)法、尺寸單位

    微信小程序:tabbar、事件綁定、數(shù)據(jù)綁定、模塊化、模板語(yǔ)法、尺寸單位

    目錄 1. tabbar 1.1 什么是tabbar ?1.2 配置tabbar? 2. 事件綁定 2.1 準(zhǔn)備表單 2.2 事件綁定 2.3 冒泡事件及非冒泡事件? 3. 數(shù)據(jù)綁定 3.1 官方文檔 4. 關(guān)于模塊化 5. 模板語(yǔ)法 6. 尺寸單位 下圖中標(biāo)記出來(lái)的部分即為tabbar: ? ?官方說(shuō)明文檔: ? 說(shuō)明: pagePath中指定的頁(yè)面,必須在app.jso

    2024年02月04日
    瀏覽(94)
  • 微信小程序------WXML模板語(yǔ)法之條件渲染和列表渲染

    微信小程序------WXML模板語(yǔ)法之條件渲染和列表渲染

    目錄 前言 一、條件渲染 1.wx:if 2. 結(jié)合 使用 wx:if 3. hidden 4. wx:if 與 hidden 的對(duì)比 二、列表渲染 1. wx:for 2. 手動(dòng)指定索引和當(dāng)前項(xiàng)的變量名* 3. wx:key 的使用 ? ? ? ? 上一期我們講解wxml模版語(yǔ)法中的數(shù)據(jù)綁定和事件綁定(上一期鏈接:微信小程序-----WXML模板語(yǔ)法之?dāng)?shù)據(jù)綁定與事件

    2024年01月16日
    瀏覽(33)
  • 【微信小程序】-- WXML 模板語(yǔ)法 - 條件渲染 -- wx:if & hidden (十一)

    【微信小程序】-- WXML 模板語(yǔ)法 - 條件渲染 -- wx:if & hidden (十一)

    ?? 所屬專欄:【微信小程序開(kāi)發(fā)教程】 ?? 作??者:我是夜闌的狗?? ?? 個(gè)人簡(jiǎn)介:一個(gè)正在努力學(xué)技術(shù)的CV工程師,專注基礎(chǔ)和實(shí)戰(zhàn)分享 ,歡迎咨詢! ?? 歡迎大家:這里是CSDN,我總結(jié)知識(shí)的地方,喜歡的話請(qǐng)三連,有問(wèn)題請(qǐng)私信 ?? ?? ?? ??大家好,又見(jiàn)面了,

    2024年02月05日
    瀏覽(38)
  • 【微信小程序】-- WXML 模板語(yǔ)法 - 列表渲染 -- wx:for & wx:key(十二)

    【微信小程序】-- WXML 模板語(yǔ)法 - 列表渲染 -- wx:for & wx:key(十二)

    ?? 所屬專欄:【微信小程序開(kāi)發(fā)教程】 ?? 作??者:我是夜闌的狗?? ?? 個(gè)人簡(jiǎn)介:一個(gè)正在努力學(xué)技術(shù)的CV工程師,專注基礎(chǔ)和實(shí)戰(zhàn)分享 ,歡迎咨詢! ?? 歡迎大家:這里是CSDN,我總結(jié)知識(shí)的地方,喜歡的話請(qǐng)三連,有問(wèn)題請(qǐng)私信 ?? ?? ?? ??大家好,又見(jiàn)面了,

    2024年02月12日
    瀏覽(30)
  • 微信小程序在 wxml 文件中使用 Array.includes 方法

    微信小程序在 wxml 文件中使用 Array.includes 方法

    微信小程序中不能直接在wxml使用includes,否則 不起作用 需要通過(guò)wxs使用: 1、在wxs下創(chuàng)建一個(gè)includes.wxs ?2、在wxml中使用 先引入 后使用

    2024年02月11日
    瀏覽(30)
  • 微信小程序調(diào)用map數(shù)據(jù) 并在wxml中對(duì)數(shù)組進(jìn)行截取的操作

    微信小程序調(diào)用map數(shù)據(jù) 并在wxml中對(duì)數(shù)組進(jìn)行截取的操作

    wxs文件的位置如圖 ? 實(shí)現(xiàn)數(shù)組截取 只保留五張圖片 ?************這個(gè)是slicefunc.wxs里的內(nèi)容是重點(diǎn)***************************** 以下的代碼不重要 只是記錄用的

    2024年02月13日
    瀏覽(20)
  • 微信小程序 搜索框?qū)崿F(xiàn)模糊搜索(帶模擬數(shù)據(jù),js,wxml,wxss齊全)

    微信小程序 搜索框?qū)崿F(xiàn)模糊搜索(帶模擬數(shù)據(jù),js,wxml,wxss齊全)

    最近在做一個(gè)小程序的頁(yè)面,搜索框困擾了我很久,今天終于把搜索框給做了出來(lái),記錄一下過(guò)程 wxml js wxss

    2024年02月20日
    瀏覽(28)
  • 微信小程序——數(shù)據(jù)綁定

    在微信小程序中,可以通過(guò)以下代碼實(shí)現(xiàn)數(shù)據(jù)綁定: 在WXML中,使用雙大括號(hào){{}}綁定數(shù)據(jù),將數(shù)據(jù)渲染到對(duì)應(yīng)的視圖中。 在JS中,定義一個(gè)數(shù)據(jù)對(duì)象,并將其綁定到頁(yè)面的data屬性上。 當(dāng)數(shù)據(jù)對(duì)象發(fā)生變化時(shí),小程序會(huì)自動(dòng)更新相關(guān)的視圖。 可以通過(guò)setData方法在JS中更新數(shù)據(jù)

    2024年02月07日
    瀏覽(23)
  • 【微信小程序】數(shù)據(jù)綁定

    【微信小程序】數(shù)據(jù)綁定

    ?作者簡(jiǎn)介:CSDN內(nèi)容合伙人、阿里云專家博主、51CTO專家博主?? ??個(gè)人主頁(yè):hacker707的csdn博客 ??系列專欄:微信小程序?? ??個(gè)人格言:不斷的翻越一座又一座的高山,那樣的人生才是我想要的。這一馬平川,一眼見(jiàn)底的活,我不想要,我的人生,我自己書(shū)寫(xiě),余生很長(zhǎng),

    2024年02月09日
    瀏覽(18)
  • 微信小程序-----input數(shù)據(jù)雙向綁定

    微信小程序-----input數(shù)據(jù)雙向綁定

    這里介紹兩種獲取的方式: 1、用戶每輸入一個(gè)字節(jié)就獲取一個(gè)字節(jié) 2、用戶全部輸入結(jié)束了之后,再一起獲取整個(gè)input輸入框的值 注意:第二種方式會(huì)比較節(jié)省內(nèi)存資源 第一種方式: ? ? ? ? 原理:我們使用bindinput事件來(lái)獲取input的輸入值,然后根據(jù)dataset獲取要跟 data數(shù)組里

    2024年02月08日
    瀏覽(18)

覺(jué)得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請(qǐng)作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包,優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包