vue 组件调用封装的外部js,在组件中如何获取js中的数据?

发布于 2022-09-12 23:43:46 字数 1755 浏览 22 评论 0

因为项目中有用到很多上传组件的功能,直接上传到oss服务器,现在我把js配置项以及数据的上传获取封装到了一个js中,在js中能获取到返回的数据,但是在组件中调用,获取不到js中返回的数据?应该怎么改代码呢?大神们,小白,请指导
外部封装的js文件代码如下:
import { Toast } from 'vant';
import { stsOss } from '@api/oss'
let OSS = require('ali-oss')

class CLIENT {
constructor (fileName, file) {

this.fileName = fileName
this.file = file

}

// 获取临时访问凭证(从后端获取)
getStsOss() {

stsOss().then(res => {
  if (res.data.code === 200) {
    this.clientInit(res.data.data)
  } else {
    this.$notify({ type: 'danger', message: res.data.msg })
  }
})

}

// 实例化oss
clientInit(data) {

let client = new OSS({
  region: 'oss-cn-shanghai',
  accessKeyId:  data.accessKeyId,
  accessKeySecret:  data.accessKeySecret,
  bucket: 'yiyong-pri',
  stsToken:  data.stsToken,
  secure: true
})
this.clientUpload(client)

}

// 上传文件方法
clientUpload(client) {

if (client) {
  return new Promise((resolve, reject) => {
    client.put(this.fileName, this.file).then(res => {
      // 下面是如果对返回结果再进行处理,根据项目需要
      if (res.res.status === 200) {
        Toast.success('上传成功')
        let attachs = []
        attachs.push({
          attachName: res.name,
          attachUrl: res.url
        })
        console.log('测试js封装返回', attachs)
        resolve(attachs)
      } else {
        Toast.fail('上传失败')
      }
    })

      .catch(err => {
      console.log('err:', err)
    })
  })

}

}
}
export default CLIENT

组件内上传时候的调用:
btnUpload(file) {

    const fileName = `/project/bidding/${file.file.name}`
    let cli = new CLIENT(fileName, file.file)
    console.log(cli.getStsOss())

}

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

剧终人散尽 2022-09-19 23:43:46

你的 cliInit 最后没有返回 clientUploadgetStsOss 中和then内部都没有相应的返回,另外建议问题不要直接贴图片,就算想指出哪里需要改,别人还得照着敲一遍代码

梦屿孤独相伴 2022-09-19 23:43:46

问题1:该方法没有return语句
问题2: 在promise中也没有也没有return,resolve的data为undefined
问题3:打印时没有在then函数中只会打印出返回promise对象
上传中![image.png
...]()

╰つ倒转 2022-09-19 23:43:46

换个思路,封装个update组件,emit出来

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文