0

我将 vuedraggable 添加到我正在制作的手机游戏中，人们可以在其中解读句子。到目前为止，它一直运作良好。我最近从精灵表中为我的可拖动元素添加了背景图像，但现在我的可拖动元素不再可拖动。有没有人对为什么会发生这种行为有任何建议？

这是我的 Vue 模板

<template>
  <div :key="verse" class="center">
    <h2 v-if="message !== ''">{{ message }}</h2>
    <div id="scriptureBackground">
      <draggable
        v-model="words"
        class="drag-list"
        :list="words"
        animation="200"
        ghost-class="moving-card"
      >
        <div
          v-for="(value, index) in words"
          :key="index"
          @mousedown="playPress"
          class="drag-word"
          :style="stoneWord"
        >
          {{ value }}
        </div>
      </draggable>
    </div>
      <p :verse="verse" slot="footer" class="verse">- {{ verse }}</p>
  </div>
</template>

stoneWord 是一个计算出来的

    stoneWord: function() {
      return {
        background: `url(${this.icons}) -2722px -60px`,
        "background-repeat": "no-repeat",
        width: "885px",
        height: "400px",
        zoom: `0.1`,
        "-moz-transform": `scale(0.1)`,
        display: "flex",
        "justify-content": "center",
        "align-items": "center",
        "font-size": `20vw`,
        "margin": "10px",
      };
    },
4

0 回答 0