美文网首页
上传图片视频

上传图片视频

作者: pomelo_西 | 来源:发表于2018-11-05 10:54 被阅读0次
    <div class="create-btn">
      <button class="bbs-btn upload-video-btn" @click="chooseVideo">上传视频</button>
      <button class="bbs-btn upload-pic-btn" @click="chooseImage">上传图片</button>
    </div>

// 图片预览
    <div class="images">
      <div v-if="upload_video != ''" class="image-item">
        <video class="image-view" :src="upload_video"></video>
        <img src="../../../dist/images/cancel.png" class="cancel-icon" @click="cancelvideo()">
      </div>
      <div v-for="(image, index) in upload_picture_list" :key="index"  class="image-item">
        <img class="image-view" :src="image">
        <img src="../../../dist/images/cancel.png" class="cancel-icon" @click="cancelImage(index)">
      </div>
    </div>
    chooseImage () {
      wx.chooseImage({
        sizeType: ['original', 'compressed'],
        sourceType: ['album', 'camera'],
        success: res => {
          this.upload_picture_list = res.tempFilePaths
          for (var i in this.upload_picture_list) {
            wx.uploadFile({
              url: 'http://localhost:81/upload_file',
              filePath: this.upload_picture_list[i],
              name: 'file',
              formData: {
                'user': 'test'
              },
              success: (res) => {
                res.data = res.data.replace(/"/g, '')
                this.image_fid.push(res.data)
              }
            })
          }
        }
      })
    },

    chooseVideo () {
      wx.chooseVideo({
        sourceType: ['album', 'camera'],
        maxDuration: 60,
        camera: 'back',
        success: (res) => {
          this.upload_video = res.tempFilePath
        }
      })
    },
    releaseBulletin () {
      wx.uploadFile({
        url: 'http://localhost:81/upload_file',
        filePath: this.upload_video,
        name: 'file',
        formData: {
          'user': 'test'
        },
        success: (res) => {
          this.video_fid = res.data.replace(/"/g, '')
        }
      })
      wx.request({
        url: 'http://localhost:81/store_content?_format=hal_json',
        method: 'POST',
        data: {
          'image_fid': this.image_fid,
          'video_fid': this.video_fid,
          'bulletin_title': this.bulletin_title,
          'bulletin_body': this.bulletin_body
        },
        header: {
          'cookie': this.cookie
        },
        success: (res) => {
          this.bulletin_title = ''
          this.bulletin_body = ''
          this.upload_picture_list = []
          this.upload_video = ''
          wx.switchTab({
            url: '../mine/main?'
          })
        }
      })
    },

    cancelImage (index) {
      this.upload_picture_list.splice(index, 1)
      this.image_fid.splice(index, 1)
    },

    cancelvideo () {
      this.upload_video = []
    }

相关文章

网友评论

      本文标题:上传图片视频

      本文链接:https://www.haomeiwen.com/subject/qdgjxqtx.html