Привязка вычисляемого значения к пользовательской директиве

#javascript #typescript #vue.js

#javascript #typescript #vue.js

Вопрос:

У меня возникли проблемы при инициализации позиции для моей пользовательской перетаскиваемой директивы. Я должен был разместить его в центре экрана. Однако, после того, как я произвел вычисления, оно привязывается только к тому, что есть в data (), что равно (0,0). Вот мой код ниже:

 export default {
  directives: {
    Drag,
  },
  data: function() {
    return {
      position: {
        x: 0,
        y: 0,
      },
      window: {
        width: 0,
        height: 0,
      },
    }
  },
  created() {
    window.addEventListener('resize', this.handleResize)
    this.handleResize()
  },
  destroyed() {
    window.removeEventListener('resize', this.handleResize)
  },
  methods: {
    handleResize() {
      this.window.width = window.innerWidth
      this.window.height = window.innerHeight
    },
  },
  mounted: function() {
    this.position.x = this.window.width / 2
    this.position.y = this.window.height / 2

  },
}
  

В HTML:

  <div class="modal-wrapper" v-drag="position">
  

Комментарии:

1. я думаю, что в этом коде нет проблем. Проверьте код директив v-drag.

2. попробуйте inserted , update подключать функции для обновления позиции vlaue в директиве v-drag. vuejs.org/v2/guide/custom-directive.html