xaboy / form-create

:fire::fire::fire: 强大的低代码动态表单组件,通过数据驱动表单渲染,适配移动端,支持可视化设计。提高开发者对表单的开发效率。目前在政务系统、OA系统、ERP系统、电商系统、流程管理等系统中已稳定应用。
https://www.form-create.com/
MIT License
5.97k stars 960 forks source link

用cdn的方式.富文本没办法显示???文档也没找到这个使用方式 #705

Open zhong0060 opened 2 months ago

zhong0060 commented 2 months ago

用cdn的方式.富文本没办法显示 版本号 (version) @form-create/element-ui@^3 UI 框架的版本 (UI version) element-plus@2.7.5

<html>
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
    <script src="https://unpkg.com/vue@3"></script>
    <!-- import CSS -->
    <link rel="stylesheet" href="https://unpkg.com/element-plus/dist/index.css">
    <!-- import JavaScript -->
    <script src="https://unpkg.com/element-plus"></script>
    <script src="https://cdn.jsdelivr.net/npm/@form-create/element-ui@^3/dist/form-create.min.js"></script>
    <title>Element Plus demo</title>
</head>
<body>
<div id="app">
    <form-create v-model="formData" v-model:api="fApi" :rule="rule" :option="option"></form-create>
</div>
<script>
    const App = {
        data() {
            return {
                //实例对象
                fApi: {},
                //表单数据
                formData: {},
                //表单生成规则
                rule:[
                    {
                        "type": "input",
                        "field": "title",
                        "title": "title",
                        "info": "",
                        "$required": false,
                        "_fc_id": "id_Fpdilxaguf71acc",
                        "name": "ref_F0hnlxaguf71adc",
                        "display": true,
                        "hidden": false,
                        "_fc_drag_tag": "input"
                    },
                    {
                        "type": "input",
                        "field": "desc",
                        "title": "desc",
                        "info": "",
                        "$required": false,
                        "_fc_id": "id_Fuxblxagugbbafc",
                        "name": "ref_F2mllxagugbbagc",
                        "display": true,
                        "hidden": false,
                        "_fc_drag_tag": "input"
                    },
                    {
                        "type": "fcEditor",
                        "field": "content",
                        "title": "内容",
                        "info": "",
                        "$required": false,
                        "_fc_id": "id_Fk40lxagui9yaic",
                        "name": "ref_Fb09lxagui9yajc",
                        "display": true,
                        "hidden": false,
                        "_fc_drag_tag": "fcEditor"
                    }
                ],
                //组件参数配置
                option: {
                    //表单提交事件
                    onSubmit: function (formData) {
                        alert(JSON.stringify(formData))
                    }
                }
            };
        },
    };
    const app = Vue.createApp(App);
    app.use(ElementPlus);
    app.use(formCreate)
    app.mount("#app");
</script>
</body>
</html>

WX20240612-214105@2x