search

fritx / vue-at

At.js for Vue.
https://fritx.github.io/vue-at/
MIT License
529 stars 114 forks source link

Trigger vue-at on Button Click #94

Open boi1 opened 5 years ago

boi1 commented 5 years ago

Hi, i'm trying to find a way to also trigger vue-at to show a member selection on button click. For example while writing this issue on github, they offer also the function to trigger the mention functionality by button click. 2019-04-03 15_10_35-New Issue · fritx_vue-at

fritx commented 5 years ago

@boi1 hi there is a related issue before but in Chinese https://github.com/fritx/vue-at/issues/26#issuecomment-331862114

<button @click="insertAt">@</button>
<at :at="at" :members="members">
  <textarea ref="ed"></textarea>
</at>
insertAt () {
  let { ed } = this.$refs
  ed.focus() // 如果之前没有焦点，则会定位到文本最前而不是最后，可能可以改进
  document.execCommand('insertText', 0, ' ' + this.at) // 一般应该要加空格
  let e = document.createEvent('HTMLEvents')
  e.initEvent('input', true, true)
  ed.dispatchEvent(e)
}
boi1 commented 5 years ago

Thank you for the fast answer, this works also with contenteditable tested with 2.5.0-beta