微信小程序學習第五天

這是我參與8月更文挑戰的第9天，活動詳情查看：更文挑戰

表單組件

input、button、checkbox-group、checkbox、radio-group、radio、textarea、picker

本地存儲

微信小程序中，也有本地存儲對象。

存儲內容

異步存儲

wx.setStorage({

  key: 存儲的名稱,

  value: 存儲的內容，

  success: 存儲完畢以後的回調函數

})

同步存儲

wx.setStorageSync(key, value);

key: 存儲的名稱

value: 存儲的內容    

demo:

wx.setStorageSync("name", {
  a: 1
})
複製代碼

存儲結果：從控制檯面板的Storage面板中查看

提取內容

異步提取數據

wx.getStorage({

  key: 要提取的內容名稱

  success: 提取完畢的回調函數

回調函數有一個參數，是一個對象，提取的內容在這個參數對象上

errMsg： 提取的提示信息

data: 提取出來的數據

})

同步提取數據

wx.getStorageSync(key)

key: 要提取的內容的名稱

返回值: 提取出來的數據

demo:

var wanglaowu = wx.getStorageSync("name");
console.log(wanglaowu)
複製代碼

輸出結果：

其它

刪除一項數據： wx.removeStorageSync(key) wx.removeStorage({key: key})

刪除所有數據： wx.clearStorage()  wx.clearStorageSync()

如今，在不一樣的頁面中傳遞數據，有一種方式了。

URL傳遞數據

在跳轉普通頁面時，能夠經過URL上掛載query部分，進行數據的傳遞。tabBar頁面不支持此種方式。

組件跳轉頁面並傳遞數據

傳遞方式：

<navigator url="/pages/index/index?a=1&b=2&c=3">

獲取方式：

在目標頁面的onLoad生命週期函數中有一個參數

demo:

<navigator url="/pages/second/second?a=1&b=2&c=3">跳轉到第二個頁面</navigator>
複製代碼

輸出:

注：redirectTo方式能夠傳遞數據

<navigator open-type='redirectTo' url="/pages/second/second?a=a&b=b&c=c" >跳轉到第二個頁面</navigator>
複製代碼

注：switchTab不可使用query傳遞數據

代碼跳轉並傳遞數據

wx.navigateTo({
  url: "/pages/second/second?a=1&b=2&c=3"
})
複製代碼

經過全局對象傳遞數據

app.js文件是一個全局生命週期配置文件。它能夠被任何頁面所獲得。

在頁面.js文件中:

var app = getApp();
複製代碼

app對象:

能夠利用它來傳遞數據。

例如：在頁面A中，getApp並設置一個數據。再到頁面B中getApp獲取該數據

rpx單位

px是像素單位。是咱們最經常使用的單位。可是px沒法實現響應式。

因而微信就設計了rpx單位。

從左到右一共分紅750份。

1rpx就是實際寬度的1/750。

若是說iPhone5： 整寬320px:   1rpx = 320 / 750

若是是iPhone6:  整寬375px:  1rpx = 375/ 750

以上分別是iPhone5和iPhone6中的rpx表現。

Web-View

該組件容許用戶在微信小程序中，嵌入HTML5頁面。

屬性： src

demo:

<web-view src="https://www.baidu.com"></web-view>
複製代碼

警告：此時，由於沒有配置業務域名，因此不容許訪問。

若是是測試使用，能夠點擊編輯代碼面板上方的詳情按鈕。

彈出一個面板，在該面板中找到不校驗合法域名、web-view這條信息 打√便可

開放組件

該組件是一個用於獲取用戶信息的組件。是爲了替代 原有的 wx.getUserInfo接口出現的。

原來的接口不讓用了:

如今: 要經過open-data組件來使用

<open-data type="userNickName"></open-data>
複製代碼

原來經過wx.getUserInfo獲得的數據

如上，獲取nickName的數據要 type="userNickName"

如今獲取city的數據要 type="userCity"

獲取country的數據 要 type="userCountry"

依次類推。

規則： type="user" + key

使用駝峯寫法。