SOURCE

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.min.js">
</script>
<script src="https://cdn.jsdelivr.net/npm/iview/dist/iview.min.js">
</script>
<script src="https://cdn.jsdelivr.net/npm/form-create/dist/form-create.min.js">
</script>
<div id="app3">
			<div id="form-create"></div>
		</div>
		<script type="text/javascript">
			//JSON 规则
			var rule = [{
					"type": "input",
					"field": "goods_name",
					"title": "商品名称",
					"value": "mi"
				},
				{
					"type": "inputNumber",
					"field": "goods_price",
					"title": "商品价格",
					"value": 12
				}
			];
			//表单插入的节点
			var root = document.getElementById('form-create');

			var $f = {},
				model = {};

			//$f为表单api
			$f = window.formCreate.create(
				//表单生成规则
				rule,
				//组件参数配置
				{
					el: root,
					//显示表单重置按钮
					resetBtn: true,
					//表单提交事件
					onSubmit: function(formData) {

						//formData为表单数据

						//按钮进入提交状态
						$f.btn.loading();
						//重置按钮禁用
						$f.resetBtn.disabled();

						//重置按钮恢复正常
						//$f.resetBtn.disabled();
						//按钮进入可点击状态
						//$f.btn.loading(false);
					}
				});

			//获取双向数据绑定的数据规则
			model = $f.model();
		</script>

@import url("//cdn.jsdelivr.net/npm/iview/dist/styles/iview.css");
#app {
  padding: 32px;
}