Vue.js 将redactor用作vue组件

我正在尝试将redactor用作vuejs 2组件，但我遇到了很多问题，因为一旦加载redactor，就会创建一个新的div，因此我无法侦听该div上的键控事件。请参阅下面的代码

Vue组件

初始化VUE

HTML

---

关于新的div，您可以监听其上的事件，但不能通过应用Vue属性。因为您位于组件内部，所以可以使用jQuery查找元素、将侦听器附加到元素，以及任何其他能够在Vue和小部件之间架起桥梁的DOM操作。只需将自己限制在组件内部的元素

Vue为您提供了一个$el成员—不要被美元符号愚弄，它不是作为组件实例根元素的jQuery对象。我没有任何关于redactor的经验，所以我不能告诉你什么会起作用，但你可能有类似的经验

---

正确包装小部件有很多方法。这对你来说将是一次学习冒险不要使用文档级jQuery选择器，而是使用这个.el作为顶级DOM元素。请参阅此处：感谢您提供的信息，我将开始我的新冒险：对于任何有相同问题的人，请参阅此问题的答案：

<template>
  <div>
    <textarea @keyup="internalValue" class="form-control question-create-editor" id="question_description" placeholder="Go wild with all the details here - make image upload work" rows="3">
  </div>
</template>

<script>
  export default {
    props: ['value'],
    data () {
      return {
        internalValue: this.value
      }
    },
    mounted: function(){
      $(function() {
        // $( document ).ready(function() {
          $('#question-create-form .question-create-editor').redactor({
            imageUpload:'/urlGoesHereBro/',
            plugins: ['video', 'imagemanager', 'counter', 'limiter'],
            buttonsHide:['html', 'formatting', 'deleted', 'indent', 'outdent', 'alignment', 'horizontalrule']
          });
          $('#question-create-form .redactor-editor').attr('v-model', 'questionDescription');
        // });
      });
    },
    watch: {
      internalValue(v){
        this.$emit($('.redactor-editor').html(), v);
      }
    }
};
</script>

Vue.component('vueredactor', require('./components/redactor-qa.vue'));

var App = new Vue({
        el: '#app',
        data: {
          questionDescription: null
        }
    });

<div id="app">
  <vueredactor v-model="questionDescription"></vueredactor>
</div>

mounted: function(){
  $(function() {
      $(this.$vm).find('.question-create-editor').redactor({
        imageUpload:'/urlGoesHereBro/',
        plugins: ['video', 'imagemanager', 'counter', 'limiter'],
        buttonsHide:['html', 'formatting', 'deleted', 'indent', 'outdent', 'alignment', 'horizontalrule']
      });
      $(this.$vm).find('.new-redactor-div').keyup((e) => {
        this.$emit('change', e);
      });
  });
},