前端适用的几个拖拉拽插件

阅读本书更多章节>>>>

今天分享几个拖拉拽的工具，包括流程图和表单

GoJSvue.draggableVue.Draggable.nextform-generator

GoJS 这个上手也挺快的，大部分需求都可以满足

vue.draggable 支持vue2

Vue.Draggable.next 是一款vue3的拖拽插件,基于Sortable.js实现的，你可以用它来拖拽列表、菜单、工作台、选项卡等常见的工作场景

Form Generator

Vue 表单生成器(Form Generator)是一个基于Schema的表单生成器组件，可以基于Schema构建反应式表单。

Vue 表单生成器(Form Generator)提供21种字段类型，、也可以使用自定义字段进行扩展。生成的模板对Bootstrap友好，并且可以轻松自定义样式。

npm install vue-form-generator//全局引入import VueFormGenerator from "vue-form-generator";import "vue-form-generator/dist/vfg.css";Vue.use(VueFormGenerator)//组件中引入<vue-form-generator :schema="schema" :model="model" :options="formOptions"></vue-form-generator>import VueFormGenerator from "vue-form-generator";export default {    components: {        "vue-form-generator": VueFormGenerator.component    },    data(){return{{  model: {    id: 1,    name: 'John Doe',    password: 'J0hnD03!x4',    skills: ['Javascript', 'VueJS'],    email: 'john.doe@gmail.com',    status: true  },  schema: {    fields: [      {        type: 'input',        inputType: 'text',        label: 'ID (disabled text field)',        model: 'id',        readonly: true,        disabled: true      },    ]  },  formOptions: {    validateAfterLoad: true,    validateAfterChanged: true,    validateAsync: true  }}}}};

阅读本书更多章节>>>>

本文链接：https://www.kjpai.cn/gushi/2024-03-28/149834.html，文章来源：网络cs，作者：亙句，版权归作者所有，如需转载请注明来源和作者，否则将追究法律责任！