vue-js-modal-“可拖动”问题

时间:2018-09-04 11:43:07

标签: vue.js modal-dialog

我正在使用vue-js-modal显示可拖动和可调整大小的模式,但是“可拖动”属性存在问题。

该模式正在打开,除“可拖动”外,所有属性均正常运行;我不能拖动模态(似乎没有效果)。 这就是我设置模式的方式:

  <modal class="vue-js-modal"
      name="modal-name"
      :draggable="true"
      :resizable="true">

    <h1>Modal Title</h1>

  </modal>

有人可以帮我解决这个问题吗? 非常感谢

1 个答案:

答案 0 :(得分:0)

我不确定是什么原因导致了您这一边的不良行为。您是否查看是否有任何错误消息干扰库或您的代码?从下面的代码示例重新尝试 将库安装为:npm install --save vue-js-modal

以下工作正常(经过测试):

<template>
  <div>
    <div class="btn btn-primary rounded border" v-html="buttonText" @click="$modal.show('modal-name')"></div>
    <modal class="vue-js-modal"
           name="modal-name"
           :draggable="true"
           :resizable="true">
      <div>
        <h1>Modal Title</h1>
        <p>My happy modal content.</p>
      </div>
    </modal>
  </div>
</template>

<script>
  import VModal from 'vue-js-modal'
  export default {
    name: 'Demo',
    components: {
      VModal
    },
    data: function () {
      return {
        buttonText: 'Open modal'
      }
    }
  }
</script>