index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>form-create示例</title>

    <link href="https://cdn.bootcss.com/iview/2.13.0/styles/iview.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/vue/2.5.13/vue.min.js"></script>
    <script src="https://cdn.bootcss.com/iview/2.13.0/iview.min.js"></script>

    <!-- npm install 后可以使
    <link rel="stylesheet" href="./node_modules/iview/dist/styles/iview.css">
    <script src="./node_modules/vue/dist/vue.min.js"></script>
    <script src="./node_modules/iview/dist/iview.min.js"></script>-->
    
    <!--省市区三级联动json数据-->
    <script src="./district/province_city_area.js"></script>
    <script src="./dist/form-create.js"></script>
    <script src="mock.js"></script>
</head>
<body>
<div id="app">
</div>
<script>
    Vue.use(formCreate);
    vm = new Vue({
        el:'#app',
        data:{
        },
        mounted:function(){
            let root = document.getElementById('app'),that = this;
            $f = this.$formCreate(mock,{
                el:root,
                onSubmit:function (formData) {
                    console.log(formData);
                    alert(JSON.stringify(formData));
                    //按钮进入提交状态
                    $f.btn.loading();
                    //按钮进入可点击状态
//                    $f.btn.finish();
                    //创建第二个表单
                    $f2 = that.$formCreate(mock,root);
                }
            });
            //动态添加表单元素
            $f.append($r,'goods_name');
        }
    });
</script>
</body>
</html>