「小程序JAVA實戰」小程序視頻上傳方法的抽象復用（57）

在用戶中心有視頻上傳，在視頻展示的時候也是視頻上傳，如何將這個js抽象出來是個關鍵，現在咱們嘗試抽離到公共js中，方便調用。源碼https://github.com/limingios/wxProgram.git 中No.15

抽象方法的步驟

• 新建公共js

• 找到mine中視頻上傳的代碼拷貝到videoUtils.js中，并修改里面的內容

function?uploadVideo()?{
??var?me?=?this
??wx.chooseVideo({
????sourceType:?['album',?'camera'],
????success:?function?(res)?{
??????console.log(res);
??????var?tempDuration?=?res.duration;
??????var?tempHeight?=?res.height;
??????var?tempWidth?=?res.width;
??????var?tempSize?=?res.size;
??????var?tempFilePath?=?res.tempFilePath;
??????var?thumbTempFilePath?=?res.thumbTempFilePath;
??????if?(tempDuration?>?20)?{
????????wx.showToast({
??????????title:?"視頻太長了老鐵不穩~",
??????????icon:?'none',
??????????duration:?3000
????????})
??????}?else?if?(tempDuration?<?5)?{
????????wx.showToast({
??????????title:?"視頻太短了不到5秒。老鐵不穩~",
??????????icon:?'none',
??????????duration:?3000
????????})
??????}?else?{
????????wx.navigateTo({
??????????url:?'../chooseBgm/chooseBgm?tempDuration='?+?tempDuration
????????????+?'&tempHeight='?+?tempHeight
????????????+?'&tempWidth='?+?tempWidth
????????????+?'&tempSize='?+?tempSize
????????????+?'&tempFilePath='?+?tempFilePath
????????????+?'&thumbTempFilePath='?+?thumbTempFilePath
????????})
??????}
????}
??})
}

#導出方法，并關聯方法名稱
module.exports={
??uploadVideo:?uploadVideo
}

• 需要使用的地方添加方法引入
  >定義名稱，require引入，在需要的方法里面直接定義的名稱點導出的方法就可以了。

var?videoUtils?=?require('../../utils/videoUtils.js')
Page({

??data:?{
????cover:'cover',
????videoContext:""
??},
??showSearch:function(){
????wx.navigateTo({
??????url:?'../videoSearch/videoSearch',
????})
??},
??onLoad:function(){
????var?me?=?this;
????me.videoContext?=?wx.createVideoContext('myVideo',?me);

??},
??onShow:function(){
????var?me?=?this;
????me.videoContext.play();
??},
??onHide:function(){
????var?me?=?this;
????me.videoContext.pause();
??},
??upload:function(){
????videoUtils.uploadVideo();
??}
})

PS：目前用到了兩次導入的方式，第一次第三方搜索組件的時候，第二次是視頻上傳。