微信小程式----關於變數對象data 和 前端wxml取後臺js變數值

来源:http://www.cnblogs.com/jc535201285/archive/2017/02/05/6367450.html
-Advertisement-
Play Games

(一)頁面變數對象data 對象data 有兩個方面用途 第一,前端wxml的數據渲染是通過設置此對象中定義的變數進行關聯展現的 第二,定義JS頁面中的頁面局部變數,使其整個頁面中可使用或調用 對象data定義的變數支持各種數據類型,string,int,[],{} 第一.wxml數據渲染,只要通過 ...


(一)頁面變數對象data

 

對象data 有兩個方面用途

第一,前端wxml的數據渲染是通過設置此對象中定義的變數進行關聯展現的

第二,定義JS頁面中的頁面局部變數,使其整個頁面中可使用或調用

對象data定義的變數支持各種數據類型,string,int,[],{}

第一.wxml數據渲染,只要通過設置data值(this.setData({...}))即可

如:

wxml頁面:detail對象中包含有TaskBillCode與BillDate兩個屬性

js頁面:

第二.頁面變數

定義:

存儲:

使用:

(二)前端wxml取後臺js變數值

 

1.js後臺只能通過設置Data里的變數值( this.setData({}) ),前臺wxml才能得到渲染  wxml以雙括弧取變數值  {{  var }}   

 JS:

 

設置變數值 :

WXML:

2. 列表渲染,即數據List  用迴圈進行渲染   wx:for="{{ taskItems}}"  預設子項為item

3.關於多數據的數據類型,目前wxml取變數只支持數組,並不支持對象

這裡面的billStatus 只能定義為數組類型,才能支持wxml用變數取數組的值  

data {

  billStatus:[]

}

如定義為下麵這樣

data {

  billStatus:{}

}

則會導致 {{billStatus[item.Status]}} 取不到值 ,但代入數值還是可以取到 {{billStatus[1]}}

4.關於在全局裡app.js定義數組

兩種方式

一種是直接在全局變數對象中定義,但這樣是指定不了下標的,下標只能從預設的0開始

 

別一種則是在全局變數對象中只定義動態數組變數,在載入後賦值  這樣是能達到指定下標變數名的效果


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 一、題目  用JS代碼求出頁面上一個元素的最終的background color,不考慮IE瀏覽器,不考慮元素float情況。 二、題目解析   1.考察底層JavaScript基礎  前端開發,日常最常接觸的就是頁面樣式的編寫。而擺脫jQuery等工具庫,用原生js獲 ...
  • css3彈性盒子模型,box-flex,box-orient,box-direction,box-align與box-pack,box-lines,box-ordinal-group ...
  • 當使用js時我們可以使用timestamp = (new Date()).valueOf();直接獲取當前時區時間點的時間戳。註意:js中時間戳的單位是毫秒,而php中則是秒 ...
  • 轉換字元串 你可以轉換一個數字,布爾值,或一個字元串的對象: 將字元串分割成多個子字元串 為了區分一個字元串轉換為一個子字元串數組,你可以使用的split()方法: 1 var myString = "coming,apart,at,the,commas"; 2 var substringArray ...
  • HTML5的語義化標簽以及屬性,可以讓開發者非常方便地實現清晰的web頁面佈局。大多數瀏覽器基本相容html5,但目前來說ie6/ie7/ie8還不相容html5標簽,所以需要javascript處理,讓其進行相容 方法一:javascript code 如果是IE9以下的IE瀏覽器將創建HTML5 ...
  • 我自認為對新技術還是比較有熱情的,可對於小程式這個“新技術”,我卻完全是被動的。去年9月份的時候,微信小程式開始內測,瞬間引爆朋友圈、知乎等一眾分享平臺。當時我大概瞭解了一下,覺得從技術角度上來說沒啥新意,也完全沒有get到網上那些人激動的點在哪裡,於是也就沒有花很多精力去深入瞭解和學習相關知識。到 ...
  • 上一篇博客講解了使用nodejs爬取博客園的博文,這次帶給大家的是下載網路上的圖片。 需要用到的第三方模塊有: superagent superagent-charset (手動指定編碼,解決GBK中文亂碼) cheerio express async (併發控制) 完整的代碼,可以在我的githu ...
  • 解決方法出自 http://stackoverflow.com/questions/23261301/required-attribute-not-work-in-safari-browser Safari不支持input的required屬性,可用js解決 本文原創,轉載請註明出處:http:// ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...