image如何上传服务器并插入editor

beibeijerry commented 7 years ago

中文用户请注意：

issue 只接受带重现的 bug 报告，请不要用来提问题！不符合要求的 issue 会被直接关闭。
请尽量用英文描述你的 issue，这样能够让尽可能多的人帮到你。
这里不是论坛不是贴吧，是针对问题本身的讨论区，不接受任何问题之外的东西。
在提出问题前，请仔细阅读REMADE.md并在已关闭的问题中寻找与自身相关的问题，它极有可能已经被解决。
问题请严格按照以下模板BUG REPORT TEMPLATE编写，禁止在标题中堆砌！

Got a question?

The issue list of this repo is exclusively for bug reports and feature requests. For simple questions, please use the following resources:
Read the docs: https://vuejs.org/guide/
Look for/ask questions on stack overflow: https://stackoverflow.com/questions/ask?tags=vue.js

Reporting a bug?

Try to search for your issue, it may have already been answered or even fixed in the development branch.
It is required that you clearly describe the steps necessary to reproduce the issue you are running into. Issues with no clear repro steps will not be triaged. If an issue labeled "need repro" receives no further input from the issue author for more than 5 days, it will be closed.
It is recommended that you make a JSFiddle/JSBin/Codepen to demonstrate your issue. You could start with this template that already includes the latest version of Vue.
For potential SSR (Server Side Rendering) issue or bugs that involves build setups, you can create a reproduction repository with steps in the README.
If your issue is resolved but still open, don’t hesitate to close it. In case you found a solution by yourself, it could be helpful to explain how you fixed it.

Have a feature request?

Remove the template from below and provide thoughtful commentary and code samples on what this feature means for your product. What will it allow you to do that you can't do today? How will it make current work-arounds straightforward? What potential bugs and edge cases does it help to avoid? etc. Please keep it product-centric.

BUG REPORT TEMPLATE

Vue.js version and component version

Reproduction Link

A minimal JSBin, JSFiddle, Codepen, or a GitHub repository that can reproduce the bug.
You could start with this template: https://jsfiddle.net/39epgLj0/

Steps to reproduce

What is Expected?

What is actually happening?

shockwavemoto commented 7 years ago

Try to search for your issue, it may have already been answered or even fixed in the development branch.

It is required that you clearly describe the steps necessary to reproduce the issue you are running into. Issues with no clear repro steps will not be triaged. If an issue labeled "need repro" receives no further input from the issue author for more than 5 days, it will be closed.

It is recommended that you make a JSFiddle/JSBin/Codepen to demonstrate your issue. You could start with this template that already includes the latest version of Vue.

For potential SSR (Server Side Rendering) issue or bugs that involves build setups, you can create a reproduction repository with steps in the README.

If your issue is resolved but still open, don’t hesitate to close it. In case you found a solution by yourself, it could be helpful to explain how you fixed it.

1008611 commented 7 years ago

i used the customButtonClick to upload pictures(change the base64 to img url ) . i can get the img url but can not insert the img url in content.

      customButtonClick(){

        var range = this.$refs.myTextEditor.quillEditor.getSelection()
        var length = range.index;

        var imageUrl = 'http://xxxxx/content/images/thumbs/0004868.jpeg'

        this.quillEditor.insertEmbed(length, 'image', imageUrl);
      },

getSelection()
insertEmbed() all undefined is customButton can not get the content focus

I have solved this problem by using a Clumsy method:

      onEditorFocus(editor) {
//        console.log('editor focus!', editor)
        this.editor = editor
      },
      onEditorReady(editor) {
//        console.log('editor ready!', editor)
        this.editor = editor
      },

      customButtonClick(){

        var range

        if (this.editor.getSelection() != null) {
          range = this.editor.getSelection()
          this.length = range.index
        } else {
          this.length = this.content.length
        }
        this.$el.querySelector('.custom-input').click();

      },
...
other code  same as [#21](https://github.com/surmon-china/vue-quill-editor/issues/21)@SkyFire-Lee    to upload img (base64  to url)       get the imgUrl
...
  finally  insert  the imgUrl
  this.editor.insertEmbed(this.length, 'image', this.imgUrl);

vue-quill-editor base64 to imgUrl

surmon-china commented 7 years ago

看到简书文章了，是dmeo 代码中实例名称定义错误，应该是quill，而非quillEditor

surmon-china / vue-quill-editor