其他分享
首页 > 其他分享> > vue基础---15拖拽

vue基础---15拖拽

作者:互联网

1.安装插件:npm install awe-dnd --save

2.引入方法,在mainjs文件中

import VueDND from 'awe-dnd'   Vue.use(VueDND)

3.使用方法

<template>
    <div>
        <div class="color-item" v-for="color in colors" v-dragging="{ item: color, list: colors, group: 'color' }" :key="color.text">
            {{color.text}}
        </div>
    </div>
</template>
<script>
    export default{
        name:"index",
        data(){
            return{
                colors: [{
                    text: "Aquamarine"
                }, {
                    text: "Hotpink"
                }, {
                    text: "Gold"
                }, {
                    text: "Crimson"
                }, {
                    text: "Blueviolet"
                }, {
                    text: "Lightblue"
                }, {
                    text: "Cornflowerblue"
                }, {
                    text: "Skyblue"
                }, {
                    text: "Burlywood"
                }]
            }
        },
        methods:{
                
            }
        }
</script>
            
<style>
            
</style>

 

标签:dnd,插件,vue,15,Lightblue,text,---,VueDND,awe
来源: https://www.cnblogs.com/hunter1/p/15710140.html