Code Monkey home page Code Monkey logo

Comments (10)

hejianxian avatar hejianxian commented on September 1, 2024

@lijiahao8898

请问具体的问题是什么?vdd-listvddl-draggable的回调说明具体看文档吧。

from vddl.

lijiahao8898 avatar lijiahao8898 commented on September 1, 2024

我拖动当前的vddl-draggable。只会触发当前的vddl-draggable,还是所有的vddl-draggable呢。

<template>
    <div class="vue-component">
        <div v-for="list in lists">
            <vddl-list :list="list" :horizontal="false">
                <vddl-draggable v-for="(item, index) in list" :key="item.id" :draggable="item" :index="index"
                                :wrapper="list" effect-allowed="copy" :moved="moved()" :cancelled="cancelled()"
                                :dragstart="dragstart()" :dragend="dragend()" :selected="selected()">
                    {{item.name}}
                </vddl-draggable>
            </vddl-list>
        </div>
    </div>
</template>

我回调是写在template和methods里面。

methods: {
            moved: function () {
                console.log('moved');
            },
            cancelled: function () {
                console.log('cancelled');
            },
            dragstart: function () {
                console.log('dragstart');
            },
            dragend: function () {
                console.log('dragend');
            },
            selected: function () {
                console.log('selected')
            }
        }

from vddl.

hejianxian avatar hejianxian commented on September 1, 2024

触发你拖动的那个元素

from vddl.

lijiahao8898 avatar lijiahao8898 commented on September 1, 2024

我回调方法都是写在 vddl-draggable 里面的,譬如 :moved="moved()" 。写法上是不是不正确。我看了您的文档。里面直说回调的方法。没有说如何调用的。

from vddl.

hejianxian avatar hejianxian commented on September 1, 2024

看看这个 simple demo

from vddl.

lijiahao8898 avatar lijiahao8898 commented on September 1, 2024

老哥,是 :moved="moved()":moved="moved" 的区别。后者就对了。我之前使用的是前者。我在您的 simple demo 里面。将回调方法 :dragstart="handleDragstart 替换成 :dragstart="handleDragstart() 也会出现我的问题。但是,这两个的写法不是应该一样的嘛?

from vddl.

hejianxian avatar hejianxian commented on September 1, 2024

你的写法,在初始化的时候,就会被执行,而作为callback,是从vddl内部在对应阶段时触发,所以你只需要传入方法名即可。

from vddl.

lijiahao8898 avatar lijiahao8898 commented on September 1, 2024

嗯。我这边又有个疑问。
vddl-list 加上 :drop="handleDrop" 的callback。元素就无法拖拽到另外的一边了。在 simple demo 中也有这样的问题。

from vddl.

hejianxian avatar hejianxian commented on September 1, 2024

如果添加了这个回调,那么vddl内部不会帮你裁剪数组,只会返回一些数据,这个操作需要你自己进行。

from vddl.

lijiahao8898 avatar lijiahao8898 commented on September 1, 2024

@hejianxian
好的。非常感谢您的耐心解答。

from vddl.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.