bing_yu2001 2021-08-13 15:29 采纳率: 57.1%
浏览 47
已结题

我在 nuxt 中集成非 Markdown 富文本编辑 element-tiptap 上传图片到服务器的问题到现在还没解决, 有人指导一下吗?

代码仓库地址: GitHub - Leecason/element-tiptap: 🌸A modern WYSIWYG rich-text editor using tiptap and Element UI for Vue.js 🌸A modern WYSIWYG rich-text editor using tiptap and Element UI for Vue.js - GitHub - Leecason/element-tiptap: 🌸A modern WYSIWYG rich-text editor using tiptap and Element UI for Vue.js https://github.com/Leecason/element-tiptap

问题描述:

img

上传图片的接口在  methods 中可以使用.
但 element-tiptap 上传图片的方法在 data 中服务接口方法没定义. Nuxt 中,我以插件的方式导入文本编辑器,渲染没问题.

```javascript
  data() {
    return {
        .....
        new Image({  // 在这里上传 接口方法没定义
          uploadRequest(file) {
            console.log('file', file)
            const data = new FormData()
            data.append('image', file)
            console.log('data', data)
            return $uploadArticleImg(data).then(response => {
              return response.data.data.url
            })
          }
        }),
      ....
  methods: {
    /**
     * 在这里上传图片到服务器,是成功的
     */
    uploadUserPhoto(file) {
      const data = new FormData()
      // console.log('file', file)
      data.append('file', file.file)
      this.$uploadUserPhoto(data).then(response => {
        if (response.code == 20000) {
          // 删除原图片,调用下面的方法
          this.deleteImg()
          // 上传成功,将OSS里的图片地址赋值给属性 coverUrl 回显,属性要先定义,否则无法回显
          this.formData.coverUrl = response.data
        }
      }).catch(() => {
        this.$message.error('上传图片失败')
      })
    },
  • 写回答

1条回答 默认 最新

  • bing_yu2001 2021-08-13 15:32
    关注

    如果能帮忙解决问题,可以付费.

    评论

报告相同问题?

问题事件

  • 系统已结题 8月21日
  • 创建了问题 8月13日

悬赏问题

  • ¥15 纯运放实现隔离采样方案设计
  • ¥20 easyconnect无法连接后缀带.com的网站,一直显示找不到服务器ip地址,但是带有数字的网站又是可以连接上的,如何解决
  • ¥15 电脑开机过商标后就直接这样,求解各位
  • ¥15 mysql , 用自己创建的本地主机和用户名 登录不上
  • ¥15 关于#web项目#的问题,请各位专家解答!
  • ¥15 vmtools环境不正常
  • ¥15 请问如何在Ubuntu系统中安装使用microsoft R open?
  • ¥15 jupyter notebook
  • ¥30 informer时间序列预测
  • ¥20 SSR引物多态性分析