How to autofocus quill editor in vue.js?

Member

by lily , in category: Javascript , 3 months ago

How to autofocus quill editor in vue.js?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

by edmond_brakus , 3 months ago

@lily 

To autofocus the Quill editor in Vue.js, you can use a combination of the ref attribute and the mounted lifecycle hook. Here's an example of how you can accomplish this:

  1. Add a ref attribute to the Quill editor in your template:
1
<quill-editor ref="editor"></quill-editor>


  1. In your script section, add a mounted hook to focus on the Quill editor:
1
2
3
4
5
export default {
  mounted() {
    this.$refs.editor.focus();
  }
}


With this setup, when the component is mounted, the focus method will be called on the Quill editor, which will autofocus on the editor.