mpvue遇到的坑

圖片

1.用img標籤，只設置寬度100%，編譯後生成的image標籤自帶高度（高度大小不知道怎麼定的），
2.圖片放在static目錄下，編譯後的dist文件夾下的static也建一個images的文件夾

v-for

1. 要寫：key=""，要否則編譯會警告

v-for="(item, index) in list" :key="item.name"

獲取受權用戶信息

1. 改版後使用wx.getUserInfo()再也不彈出受權彈窗：
2. 解決方案：使用wx.getSetting，成功回調裏判斷是否受權過用戶信息。if (res.authSetting['scope.userInfo'])

// 判斷用戶受權信息並作相應處理
wx.getSetting({
  success(res) {
    if (res.authSetting['scope.userInfo']) {
      // 已經受權，能夠直接調用 getUserInfo 獲取頭像暱稱
      wx.getUserInfo({
        success: function(data) {
          console.log(data.userInfo)
        }
      })
    } else {
    // 沒有受權過的用戶，跳轉到本身寫的受權提示頁面
      wx.navigateTo({
        url: '/pages/getUserInfo/main'
      })
    }
  }
})

// getUserInfo頁面
// 用戶點擊容許，這裏有個坑
// 原生wx的寫法
<button plain='true' open-type='getUserInfo' getuserinfo='onGotUserInfo'>容許</button>
// 使用mpvue的寫法，點擊事件，要加上@符號
<button plain='true' open-type='getUserInfo' @getuserinfo='onGotUserInfo'>容許</button>
// 點擊的methods方法
methods: {
  onGotUserInfo(e) {
    // 數據是e.mp
    console.log(e)
  }
}

使用web-view對應用進行轉譯成小程序？？？沒試過...

配置

1. 在子頁面的main.js中添加，配置小程序原生的配置

import Vue from 'vue'
import App from './index'

const app = new Vue(App)
app.$mount()
export default {
  config: {
    navigationBarTitleText: "列表",
    enablePullDownRefresh: true // 對應的子頁面有下拉刷新功能
  }
}

1. 根目錄下的main.js的配置對應的是小程序的app.json