Skip to content

上传模块

点我查看API

集成和使用ESUploadModule模块。

  • ESUploadManager是对ESUploadModule进一步封装。
  • 开发者可以直接使用ESUploadModule。建议直接使用ESUploadManager

集成

package.json引入库

点击查看源码
js
"@extscreen/es-uploader": "x.x.x"

初始化上传模块

示例代码

点击查看源码
js
ESUploadManager.init().then(
    () => {
    },
    error => {
    }
)

开始上传

示例代码

点击查看源码
js
 ESUploadManager.upload(
    this.uploadUrl,//上传接口
    this._mediaType,//文件类型
    this._filePramsKey,//参数
    this.filePath,//文件路径
    this.uploadParams//上传接口其他参数
)

监听上传状态

示例代码

点击查看源码
js
export default {
    mixins: [ESUpload],
    methods: {
        onESUploadStart(params) {
        },
        onESUploadSuccess(params) {
        },
        onESUploadError(params) {
        },
    }
}

完整示例

示例代码

点击查看源码
vue
<template>
  <div class="es-sdk-root-css">
    <title class="es-sdk-content-title-css" :text="this.$options.name"/>
    <div class="es-sdk-content-divider-css"/>
    <div class="es-sdk-content-column-css">
      <text :text="'上传状态:' + text"></text>
      <text-button text="点击上传" @onButtonClicked="onButtonClicked"/>
    </div>
  </div>
</template>

<script>
import {ESPage} from "@extscreen/es-core";
import {ESUpload, ESUploadManager} from "@extscreen/es-uploader";

export default {
  name: "上传模块",
  mixins: [ESPage, ESUpload],
  data() {
    return {
      text: '',
      uploadUrl: "http://baidu.com",
      mediaType: "multipart/form-data",
      filePramsKey: "file",
      uploadParams: {
        format: "mp3",
      },
      filePath: '/data/data/xxxx/demo.mp3'
    }
  },
  methods: {
    onESCreate(params) {
      ESUploadManager.init().then(
        () => {
        },
        error => {
        }
      )
    },
    //---------------上传状态回调----------------------------------
    onESUploadStart(params) {
      this.text = '上传开始:' + JSON.stringify(params);
    },
    onESUploadSuccess(params) {
      this.text = '上传成功:' + JSON.stringify(params);
    },
    onESUploadError(params) {
      this.text = '上传错误:' + JSON.stringify(params);
    },
    //-----------------------------------------------------------
    onButtonClicked() {
      ESUploadManager.upload(
        this.uploadUrl,
        this._mediaType,
        this._filePramsKey,
        this.filePath,
        this.uploadParams
      )
    }
  }
}
</script>
<style>
</style>