你将学到的
  • Vue Cli 3 使用
  • 设计器布局
  • VueDevtools 使用
  • 表单、字段属性配置
  • 构建生成表单数据
  • 绑定动态数据
  • vuedraggable 拖拽组件使用
  • 表单对象设置
  • 编辑区组件封装
  • Vue 组件对象传递与 sync 修饰符
  • 表单数据校验
  • 打包发布
课程内容
  共8个章节
课程介绍

课程简介

本课程使用现在流行的 Vue.js 和 ElementUI 从零开始开发一个可拖拽的表单设计器,项目使用Vue CLI 3 搭建,课程讲述了如何快速创建一个Vue项目,如何实现拖拽,Vue组件封装,Vue高级特性用法,如何打包发布项目到NPM上等众多干货。通过详细的例子,由浅入深,一步一步的实现拖拽表单设计器。

实验任务

  • 使用 Vue Cli 3 完成项目搭建
  • vuedraggable 拖拽组件的使用
  • vue 组件的封装
  • vue 对象传递
  • 生成表单数据
  • 表单验证
  • 绑定动态数据
  • 打包发布组件

先学知识

适合人群

本课程适用于具有一定前端基础的同学。

课程信息

  • 学习周期:课程有效期 2 个月,2 个月后实验文档一直可以看。高级会员有效期内可一直学习,高级会员到期后课程失效(不能看文档)。
  • 课程价格:当前优惠价格 79 元。
  • 企业团报:可获得更多支持服务,请点击购买咨询

实验截图

组件属性编辑

图片描述

表单校验

图片描述

获取表单数据

图片描述

课程教师

gavin 共发布过 1 门课程

某科技公司高级前端工程师,丰富的项目实战经验,vue-form-making表单设计器作者,GitHub开源社区贡献者。github:https://github.com/GavinZhuLei

查看老师的所有课程 >
实验楼楼+
实验楼会员