1. 程式人生 > 其它 >微信小程式常用的方法

微信小程式常用的方法

微信使用本地儲存

wx.setStorageSync("system",this.globalData.system); //同步設定值  
    //判斷機型ios 安卓
    let system = wx.getStorageSync('system'); //同步獲取儲存的值
    console.log(system);
    //注意  wx.getStorageInfoSync() 獲取的是儲存的key,currentSize,limitSize沒有值

在app.js 的onLanch函式中判斷系統Android還是iOS

if(!wx.getStorageInfoSync().keys.includes('system')){
      wx.getSystemInfo({
        success: (result) 
=> { if(result.system.indexOf('iOS')!=-1){ this.globalData.system = "iOS"; }else if(result.system.indexOf('Android')!=-1){ this.globalData.system = "Android"; }else { this.globalData.system = "Unknow"; } wx.setStorageSync(
"system",this.globalData.system); }, }) }

在頁面中如何獲取app.js中的全域性資料

 const app = getApp();//可以使用app.globalData去使用定義的全域性資料
 onLoad:function(){
    // 生命週期函式--監聽頁面載入
      let type=1;
      if(app.globalData.system=='iOS'){
          type=2;
      }
      request('/banner',{type}).then(res=>{
          
this.setData({ bnannerLsit:res.banners }) }) },

引入iconfont字型圖示,在app.wxss中引入字型圖示

@import "/static/iconfont/iconfont.wxss";
將公共的部封裝成元件

首先在page同級頁面新建components資料夾,新建page,在.json檔案中宣告

{
  "component": true,//宣告為組建
  "usingComponents": {}
}

在.js檔案中宣告

// components/NavHeader/NavHeader.js
Component({
  /**
   * 元件的屬性列表, 由元件外部傳入的資料, 等同於Vue中的props
   */
  properties: {
    title: {//可以在wxml中使用{{}}
      type: String,
      value: '我是title預設值'
    },
    nav: {
      type: String,
      value: '我是nav預設值'
    }
  },
​
  /**
   * 元件的初始資料
   */
  data: {
  
  },
​
  /**
   * 元件的方法列表
   */
  methods: {
  
  }
})
​

如果使用元件的話在需要使用元件的地方的.json檔案中

{
  "usingComponents": {
    "NavHeader": "/components/NavHeader"//元件名:元件的路徑
  }
}

在wxml中直接使用

 <NavHeader title="推薦歌曲" nav="為你精心推薦"></NavHeader>