Vue可视化表单设计器是一个基于Vue.js的表单设计器，用于快速生成表单，可以大大提高开发效率。使用步骤如下：
在命令行中输入以下命令安装：
npm install vue-form-making --save
在Vue项目中使用Vue可视化表单设计器，需要在组件中引入：
import VueFormMaking from 'vue-form-making'
import 'vue-form-making/dist/FormMaking.css'
在组件的template中使用Vue可视化表单设计器，例如：
<template>
<div>
<vue-form-making :value="formValue" :schema="formSchema" @change="onFormChange"/>
</div>
</template>
其中，formValue为当前表单的值，formSchema为表单的配置项，onFormChange为表单值变化时的回调函数。
在组件中配置表单项，例如：
<script>
export default {
data() {
return {
formValue: {},
formSchema: {
fields: [
{
type: 'input',
label: '用户名',
model: 'username',
placeholder: '请输入用户名'
},
{
type: 'password',
label: '密码',
model: 'password',
placeholder: '请输入密码'
}
]
}
}
},
methods: {
onFormChange(value) {
console.log(value)
}
}
}
</script>
其中，fields为表单项的数组，每个表单项包含type、label、model、placeholder等属性。
在命令行中输入以下命令运行项目：
npm run serve
然后在浏览器中打开项目即可看到可视化表单设计器。
