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 // 對應的子頁面有下拉刷新功能
  }
}

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