您好,登錄后才能下訂單哦!
這篇文章主要為大家展示了微信小程序如何實(shí)現(xiàn)上傳帖子,內(nèi)容簡(jiǎn)而易懂,下面讓小編帶大家一起學(xué)習(xí)一下吧。
public.js
var graceJS = require('../../utils/grace.js'); import { config } from '../../config.js' Page({ /** * 頁(yè)面的初始數(shù)據(jù) */ data: { imglist: [], title:'', content:'', }, delImg(e) { let index = e.currentTarget.dataset.index; let array = []; console.log(index); for (var i = 0; i < this.data.imglist.length; i++) { if (i !== index) { array.push(this.data.imglist[i]) } } console.log(array); this.setData({ imglist: array, }) }, upimg() { let that = this var url = config.api_base_url + "upload_pic" wx.chooseImage({ count: 1, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], success(res) { const tempFilePaths = res.tempFilePaths; wx.showLoading({ title: '上傳中', }) wx.uploadFile({ url, filePath: tempFilePaths[0], name: 'file', success(res) { console.log(res.data); wx.hideLoading() if (res.data == '0') { graceJS.msg('上傳失敗'); }else{ console.log(res.data) if (res.data.indexOf("非法圖片")>=0){ graceJS.msg(res.data); } else { graceJS.msg("上傳成功"); var array = that.data.imglist.concat(res.data) that.setData({ imglist: array, }) } } } }) } }) }, zf_title:function(e){ this.setData({ title: e.detail.value }) }, zf_content: function (e) { this.setData({ content: e.detail.value }) }, tj_info: function (event){ var that = this; console.log("event", event) var title = this.data.title; var content = this.data.content; console.log(title) console.log(content) var imglist = that.data.imglist; var uid = wx.getStorageSync('user').id if (!title && !content) { graceJS.msg("請(qǐng)?zhí)顚懲暾?quot;); } else { //寫入數(shù)據(jù)庫(kù) if (uid != undefined) { graceJS.post( config.api_base_url + 'tiezi_add', {title:title, content:content,uid:uid,imglist:imglist}, 'json', {}, // 此處 {} 代表不設(shè)置 header 數(shù)據(jù) function(res){ if (res.result == 1) { graceJS.msg(res.msg); setTimeout(()=>{ graceJS.navigate('../discover/discover','switchTab'); },2000) }else{ graceJS.msg(res.msg); } } ); }else{ graceJS.msg("用戶ID獲取失敗"); } } }, /** * 生命周期函數(shù)--監(jiān)聽頁(yè)面加載 */ onLoad: function (options) { }, /** * 生命周期函數(shù)--監(jiān)聽頁(yè)面初次渲染完成 */ onReady: function () { }, /** * 生命周期函數(shù)--監(jiān)聽頁(yè)面顯示 */ onShow: function () { }, /** * 生命周期函數(shù)--監(jiān)聽頁(yè)面隱藏 */ onHide: function () { }, /** * 生命周期函數(shù)--監(jiān)聽頁(yè)面卸載 */ onUnload: function () { }, /** * 頁(yè)面相關(guān)事件處理函數(shù)--監(jiān)聽用戶下拉動(dòng)作 */ onPullDownRefresh: function () { }, /** * 頁(yè)面上拉觸底事件的處理函數(shù) */ onReachBottom: function () { }, /** * 用戶點(diǎn)擊右上角分享 */ onShareAppMessage: function () { } })
publish.wxml
<!--pages/publish/publish.wxml--> <view> <form > <view class="publish_a"> <view class="publish_a1"> <view class="publish_a1_a"> <input type="text" name="title" bindinput="zf_title" placeholder="輸入標(biāo)題" /> </view> <view class="publish_a1_b"> <textarea name="content" bindinput="zf_content" placeholder="輸入內(nèi)容文字"></textarea> </view> <view class="publish_a1_c"> <view class="publish_a1_c1" > <image src="../../img/127.png" bindtap="upimg"></image> </view> <view class="publish_a1_c2"> <view wx:for="{{imglist}}" bindtap="delImg" data-index="{{index}}"> <image src="{{item}}" ></image> <text>X</text> </view> </view> </view> </view> </view> <view class="publish_b" bind:tap="tj_info">發(fā)布帖子</view> </form> </view>
publish.wxss
/* pages/publish/publish.wxss */ page{ padding-bottom: 120rpx; } .publish_a{ padding: 20rpx; } .publish_a1{ background-color: #f5f2f4; padding: 20rpx; } .publish_a1_a input{ width: 100%; height: 80rpx; line-height: 80rpx; font-size: 28rpx; font-weight: bold; } .publish_a1_b textarea{ width: 100%; font-size: 28rpx; } .publish_a1_c1{ margin-bottom: 20rpx; } .publish_a1_c1 image{ display: block; width: 200rpx; height: 200rpx; } .publish_a1_c2{ display: flex; flex-wrap: wrap; } .publish_a1_c2 view{ position: relative; width: 200rpx; height: 200rpx; margin-right: 20rpx; margin-bottom: 20rpx; } .publish_a1_c2 image{ display: block; width: 100%; height: 100%; } .publish_a1_c2 text{ display: block; position: absolute; right: 0; top: 0; width: 40rpx; height: 40rpx; text-align: center; line-height: 40rpx; font-size: 26rpx; color: #fff; background-color: rgba(0,0,0,0.3); } .zf_btn{ width: 500px; } .publish_b{ position: fixed; left: 0; bottom: 0; /* width: 100%; */ background-color: #a67f4a; line-height: 100rpx; text-align: center; color: #fff; font-size: 30rpx; min-width: 380px; width: 100%; padding: 0; margin: 0; }
tp
引入 use EasyWeChat\Factory; public function __construct ( Request $request = null ) { $this->config = [ 'app_id' => 'wx4**********fd45a65', 'secret' => '082dec1****5b93d286c093e01', 'response_type' => 'array', 'log' => [ 'level' => 'debug', 'file' => __DIR__.'/log/wechat.log', ], ]; $this->uid = ''; } public function tiezi_add(){ $data = input('post.'); if($data['imglist']!=[]){ foreach ($data['imglist'] as $k => $vo) { $data['imglist'][$k] = trim($vo); } $data['album'] = trim(implode(',', $data['imglist'])); } unset($data['imglist']); $data['cid'] = 17; $data['status'] = 1; $data['sort'] = 0; $data['ctime'] = time(); if(!isset($data['album'])){ return jserror('至少上傳一張圖片 '); } //驗(yàn)證 $miniProgram = Factory::miniProgram($this->config); $result = $miniProgram->content_security->checkText($data['content']); $result2 = $miniProgram->content_security->checkText($data['title']); if($result['errcode']!='0'){ return jserror('含有非法關(guān)鍵詞'); } if($result2['errcode']!='0'){ return jserror('含有非法關(guān)鍵詞'); } //保存 $res = Db::name('post')->insert($data); if($res){ return jssuccess('發(fā)布成功'); }else{ return jserror('發(fā)布失敗'); } } public function upload_pic(){ $file = request()->file('file'); $info = $file->validate(['ext'=>config()['web']['file_ext']])->move('./public/upload/admin/file'); $getSaveName = str_replace('\\', '/', $info->getSaveName());//win下反斜杠替換成斜杠 $msg = 'http://'.$_SERVER['SERVER_NAME'].'/public/upload/admin/file/'.$getSaveName; if(is_file('./public/upload/admin/file/'.$getSaveName)){ //驗(yàn)證圖片 $miniProgram = Factory::miniProgram($this->config); $result = $miniProgram->content_security->checkImage('./public/upload/admin/file/'.$getSaveName); if($result['errcode']!='0'){ return '非法圖片'; }else{ return $msg; } ################ }else{ return '0'; } }
以上就是關(guān)于微信小程序如何實(shí)現(xiàn)上傳帖子的內(nèi)容,如果你們有學(xué)習(xí)到知識(shí)或者技能,可以把它分享出去讓更多的人看到。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。