Перетаскивание неправильного компонента бунта - PullRequest
Новая
       19

Перетаскивание неправильного компонента бунта

0 голосов
/ 26 мая 2018

Я создаю перетаскиваемый элемент SVG, основанный на jot-ом. 

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <g name="green" data-is="r-rect" x="30" y="230" width="256" height="64" rx="5" ry="5" draggable="true" fill="green"></g>
  <g name="blue" data-is="r-rect" x="10" y="110" width="256" height="64" rx="5" ry="5" draggable="true" fill="blue"></g>
</svg>

r-rect.tag 

<r-rect>
        <rect ref="rect" onmousedown={hold}   />

        <script>
            tag = this;
    tag.hold = hold;
    tag.x= Number.parseInt(opts.x);
    tag.y= Number.parseInt(opts.y);
    tag._name= opts.name;

    tag.on("mount", function(e) {
        tag.refs.rect.setAttribute("x", opts.x);
      tag.refs.rect.setAttribute("y", opts.y);
      tag.refs.rect.setAttribute("width", opts.width);
      tag.refs.rect.setAttribute("height", opts.height);
      opts.rx && (tag.refs.rect.setAttribute("rx", opts.rx) );
      opts.ry && (tag.refs.rect.setAttribute("ry", opts.ry) );
    })

    function hold(e){
        console.log(tag._name)
    }
  </script>
</r-rect>

Я добавляю 2 r-rectтеги.Попробуйте перетащить синий прямоугольник.Но mousedown событие зеленого прямоугольника срабатывает всегда.

http://jsfiddle.net/1k2gacy1/1/

1 Ответ

0 голосов
/ 26 мая 2018

Я нашел проблему.Это происходило потому, что я назначал экземпляр тега в глобальной переменной.Поэтому я изменил эту строку tag = this; на var tag = this;.И это решило проблему.

...