微信小程式(將學生資訊上傳到阿里雲資料庫)
阿新 • • 發佈:2019-01-07
//上傳 function upload(that,id){ if(that.data.imageList.length==0){ return; } wx.uploadFile({ url:"http://lichenlu.top/server/index.php/home/index/upload", filePath:that.data.imageList[0], name:'file', formData:{ 'id':id }, success:function(res){ var data = res.data; console.log(data); var json = JSON.parse(res.data); wx.showToast({ title:json.msg, icon:'none', duration:3000 }) } }) } Page({ data: { sex:'女', imageList:[] }, onLoad: function () { }, switchChange:function(e){ if(e.detail.value){ this.setData({sex:'女'}) }else{ this.setData({ sex: '男' }) } }, getUserInfo: function(e) { console.log(e) app.globalData.userInfo = e.detail.userInfo this.setData({ userInfo: e.detail.userInfo, hasUserInfo: true }) }, formsubmit:function(e){ var no = e.detail.value.no; var name = e.detail.value.name; var sex = e.detail.value.sex; var age = e.detail.value.age; wx.request({ url:"http://lichenlu.top/server/index.php/home/index/index", data:e.detail.value, method:'POST', data: { no: no, name: name, sex:sex, age:age }, header: { 'content-type': 'application/x-www-form-urlencoded' }, success: (res)=> { console.log(res); if (res.error) { wx.showToast({ //延時跳轉 title: res.data.msg, icon: 'none', duration: 2000 }) } else { //上傳照片 upload(this,res.data.id); wx.showToast({ //延時跳轉 title: '新增成功', icon: 'success', duration: 2000, success: function () { setTimeout(function () { // // wx.removeStorage({ key: 'student', }) // // wx.navigateBack({ delta: 1 }) wx.navigateTo({ url: '../head/head', }) }, 1000) } }) } } }) },
首先獲取學號,姓名,性別,年齡等資料, 設定提交按鈕的繫結事件formsubmit,
呼叫介面
url:"http://lichenlu.top/server/index.php/home/index/index"之前需要獲取一些欄位值//照相 chooseImage: function () { var that = this wx.chooseImage({ // // sourceType: sourceType[this.data.sourceTypeIndex], // sizeType: sizeType[this.data.sizeTypeIndex], // count: this.data.count[this.data.countIndex], count: 1, // 預設9 sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖,預設二者都有 sourceType: ['album', 'camera'], // 可以指定來源是相簿還是相機,預設二者都有 success: function (res) { console.log(res) that.setData({ imageList: res.tempFilePaths }) } }) }, //預覽圖片 previewImage: function (e) { var current = e.target.dataset.src wx.previewImage({ current: current, urls: this.data.imageList }) } })
上傳uploads圖片時js中要寫關於預覽圖片的一些事件
後臺介面中也要自己事先寫好方法並傳入阿里雲伺服器上寫上index方法
public function index($no,$name,$sex,$age){ $data['no'] = $no; $data['name'] = $name; $data['sex'] = $sex; $data['age'] = $age; $id = M('student')->add($data); if($id){ return $this->ajaxReturn(array('error'=>false,'id'=>$id,'msg'=>'新增成功')); }else{ return $this->ajaxReturn(array('error'=>true,'msg'=>'添加出錯')); } }