一個C#程序員學習微信小程序的筆記

客戶端打開小程序的時候，就將代碼包下載到本地進行解析，首先找到了根目錄的?app.json?，知道了小程序的所有頁面。

在這個Index頁面就是我們的首頁，客戶端在啟動的時候，將首頁的代碼裝載進來，通過微信的機制，就渲染出來了頁面。

App({onLaunch() {// 小程序啟動之后 觸發 } })

小程序在啟動的時候，首先通過?App()?定義的?App()?實例的?onLaunch??方法，這個方法是各個頁面共享的，當然還有更多的回調事件。

Page({data: {text: 'init data',array: [{msg: '1'}, {msg: '2'}]} })

在頁面加載時，data這個屬性會提供給頁面使用，會以Json的形式返回給前端，然后我們可以試著把這個值渲染在頁面上。

<view>{{text}}</view> <view>{{array[0].msg}}</view>

?小程序頁面中還有很多的方法，像?onReady()?當頁面加載妥當，可以進行交互的時候觸發，還有小程序被切入后臺的?OnHide()?事件。當然這些都是應用級的事件，還有一些和用戶親密交互的事件，官方稱這種叫做頁面事件處理函數。

像最操蛋的是微信小程序沒有下拉事件?onPullDownRefresh()?，這個東西自己搞，我也是福氣了，不過也對，這東西解耦，就當我剛才說的是放屁。。。例如以下代碼。

在.json文件里設置 "enablePullDownRefresh": true,用于開啟頁面下拉加載效果，可以當前頁設置也可以全局設置；

{　　//當前頁"enablePullDownRefresh": true //當前頁"backgroundTextStyle": "dark" //頂部顯示顏色為深色的三個點 } "window": { //全局"enablePullDownRefresh": true //全局"backgroundTextStyle": "dark" //頂部顯示顏色為白色的三個點}

然后在某個頁面的js中，去寫一個下拉事件，然后例如這樣的。

onPullDownRefresh:function(){var that = this;that.setData({currentTab: 0 //當前頁的一些初始數據，視業務需求而定 })
wx.startPullDownRefresh()； this.onLoad(); //重新加載onLoad()console.log('i am refreshing....');}

經過微信開發者的調試工具，我們可以輕松看到log的記錄，在那個setData里面是初始的數據。

?最后，在onload事件中停止刷新。

onLoad: function (options) {wx.stopPullDownRefresh() //刷新完成后停止下拉刷新動效},

你可以通過一個按鈕來進行刷新，bindtap可以直接請求邏輯層。

下面就要說一說事件了，事件是視圖層到邏輯層的通訊方式。事件是綁定到dom上的，當觸發的時候就回去執行響應的邏輯層。這些都是最基本的。

但是其中的事件分為?bindtap?和?catchtap?。那這兩個有什么區別呢？一個是冒泡 一個是不冒泡。那這冒不冒泡又是個什么鬼意思呢？

<view id="outer" bindtap="handleTap1">outer view<view id="middle" catchtap="handleTap2">middle view<view id="inner" bindtap="handleTap3">inner view</view></view> </view>

經過測試，點擊inner view 會觸發 inner view和 middle view的事件，而點擊 middler view 則只會觸發它的事件，因為再放上走被outer view給擋住了 。

此處為了調試，請在app.json中的pages中添加頁面，然后可以通過以下代碼進行跳轉。

wx.navigateTo({url: '../demo/demo',})

在小程序中，也支持本地存儲。 例如api ?wx.setStorage()?和wx.?setStorageSync()?。

還有就是它和Vue一樣不支持jquery，也就是沒法裝逼了。另外我關注的自適應。微信小程序支持rpx；可以達到自適應。這我開心壞了。

為了安全性，它不知道跳轉外網。這個可能需要申請（money，你懂的。）

問題：關于無法小白我沒辦法獲取input里面的值，因為沒辦法操作dom，這個是有原因，因為微信小程序無法確定dom，因為是有中間的編譯，這和vue有點差距?？梢赃@么操作。

解決：微信對input的組件，提供了多個事件，看來只能通過這些事件去實現單個input的值的獲取。

根據這些表單事件我們可以去獲取里面的值然后去改data里面的值，也就達到這效果。

看樣子，小程序比Vue還要優雅。

原文地址https://www.cnblogs.com/ZaraNet/p/10470648.html

總結

以上是生活随笔為你收集整理的一个C#程序员学习微信小程序的笔记的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。