Должна ли вызываться функция onload Svg и vue.js при использовании Mounting? - PullRequest
0 голосов
/ 02 июня 2019

Я не уверен, что это то место, где код закончится, но сейчас я пытаюсь протестировать, чтобы мои объекты SVG перетаскивались в моем компоненте vue.Однако перетаскиваемый код не выполняется при загрузке.Я получаю сообщение об ошибке makeDraggable определено, но никогда не используется, однако я хотел бы использовать его только в режиме onload, но это не работает, я предполагаю, что это как-то связано с реактивной природой Vues, ​​и я должен попытаться вызвать его на смонтированном или как-то еще?

<template>
  <div class="spaceview">
    <h2>Space Man !</h2>
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="400"
      height="1800"
      id="space"
      onload="makeDraggable(evt)"
    >
      <g
        v-for="(note, index) in notes"
        :key="index"
        :transform="`translate(0, ${index * 170})`"
        class="draggable"
      >
        <rect height="120" width="80" fill="#f0b375"></rect>
        <text y="15">{{ note.text }}</text>
      </g>
    </svg>
  </div>
</template>

<script>
import { mapState } from 'vuex'

export default {
  name: 'YourData',
  computed: mapState({
    notes: state => state.notes
  })
}
// drag code for now included in SpaceView

function makeDraggable(evt) {
  console.log('yo')

}

1 Ответ

0 голосов
/ 02 июня 2019

Используйте событие @load= Vue вместо onload=.

 <svg
  xmlns="http://www.w3.org/2000/svg"
  width="400"
  height="1800"
  id="space"
  @load="makeDraggable"
>

Вам также не нужно вызывать его как функцию и передавать evt, vue сделает это за вас.

...