微信小程序開發(fā)js代碼教程
之前和大家介紹了什么是微信小程序開發(fā)js代碼,今天就和大家介紹一下微信小程序開發(fā)js代碼教程。
步驟一:打開微信小程序開發(fā)js編輯頁面
打開index.js編輯頁面,我們先把這頁面的所有內(nèi)容都清空,然后輸入Page,開發(fā)者工具會彈出提示,這時按tab鍵即可生成默認代碼。
①.Page({}) 包括頁面的所有操作代碼。
②.Page中,data里面包含了wxml頁面所需要的所有初始數(shù)據(jù)。
③.Page中其它 on 開頭的都是小程序自帶的函數(shù),用來響應用戶的響應動作,這些大家可以簡單看一下都能執(zhí)行什么操作,然后就都可以刪掉了(暫時)。
步驟二:綁定數(shù)據(jù)
①.首先在data中添加一段內(nèi)容:
②.然后更改咱們上節(jié)課index.wxml中的代碼:
③.這回咱們保存(ctrl+s),可以看到如下內(nèi)容
{{content}},兩個大括號包圍的內(nèi)容是數(shù)據(jù)綁定的方式,好處是在js文件內(nèi)可以處理動作,根據(jù)動作對文字進行改變,那么如何做這些動作呢?
接下來咱們在index.wxml 和 index.js文件里分別作如下改動:
bindtap:是對wxml中元素進行動作綁定,也就是當你點擊此元素時,會調(diào)用js文件中的相應函數(shù)進行執(zhí)行,在本例中,就是點擊view元素(紅色塊)時會調(diào)用click函數(shù),index.js中的click函數(shù)被執(zhí)行。
click: function(): 這段代碼是函數(shù)的格式,無需糾結(jié),只需要記住這個格式即可。
this.setData({ ?}):這部分是本文關鍵,是小程序后端數(shù)據(jù)更改的關鍵部分,用來對data中初始值進行改變,改變的模式是 content: “xxx”
(至于this是什么意思,咱們后續(xù)課程會詳細講解),同以往學習的語言不同,這個是以冒號為分隔,左側(cè)是變量(只能是data中的變量),右側(cè)是要改變的值,其實就是C語言中的賦值操作,C語言中咱們這么寫,content=”xxx”,在這里把 等號(=) 換成冒號(:) 。
編寫完保存,這時候咱們點擊紅色塊,得到新內(nèi)容:
以上就是微信小程序開發(fā)js教程,大家躍躍欲試有木有,趕緊打開開發(fā)者微信小程序開發(fā)工具試試吧。
版權聲明:
本站所有文章和圖片均來自用戶分享和網(wǎng)絡收集,文章和圖片版權歸原作者及原出處所有,僅供學習與參考,請勿用于商業(yè)用途,如果損害了您的權利,請聯(lián)系網(wǎng)站客服處理。