feat(lib): 支持配置 fui 自定义function

re #323

Author: Jino Liu

packages/demo/demo-v2/src/pages/vue-editor/views/editor/viewComponents/FlashSaleGoodsList/index.js

@@ -2,7 +2,7 @@
  * Created by Liu.Jun on 2019/12/4 15:06.
  */
 
-import propsSchema from './schema.json';
+import propsSchema from './schema.js';
 import uiSchema from './uiSchema.js';
 
 const View = () => import('./View.vue');

packages/demo/demo-v2/src/pages/vue-editor/views/editor/viewComponents/FlashSaleGoodsList/schema.js

@@ -0,0 +1,52 @@
+export default {
+    $schema: 'http://json-schema.org/draft-07/schema#',
+    type: 'object',
+    definitions: {
+        ImgItem: {
+            type: 'object',
+            properties: {
+                imgUrl: {
+                    title: '图片地址',
+                    type: 'string',
+                    format: 'uri'
+                },
+                imgLink: {
+                    title: '链接地址',
+                    type: 'string',
+                    format: 'uri',
+                    default: 'https://www.jd.com'
+                }
+            },
+            required: [
+                'imgUrl',
+                'imgLink'
+            ]
+        }
+    },
+    properties: {
+        startTime: {
+            title: '配置秒杀开始时间',
+            type: 'string',
+            format: 'date-time'
+        },
+        seckillBrand: {
+            $ref: '#/definitions/ImgItem'
+        },
+        goodsList: {
+            type: 'array',
+            minItems: 4,
+            maxItems: 8,
+            uniqueItems: true,
+            'ui:onArrayOperate': (formData, command, payload) => {
+                debugger;
+            },
+            items: {
+                $ref: '#/definitions/ImgItem'
+            }
+        }
+    },
+    required: [
+        'startTime'
+    ],
+    additionalProperties: false
+};

packages/demo/demo-v2/src/pages/vue-editor/views/editor/viewComponents/FlashSaleGoodsList/schema.json

@@ -17,8 +17,11 @@ export default {
         txt: {
             title: '文字',
             type: 'string',
-            'ui:placeholder': '输入你的内容',
-            'err:required': '必须输入标题文字内容'
+            'err:required': '必须输入标题文字内容',
+            'fui:placeholder': (parent, root, prop) => {
+                console.log(parent, root, prop);
+                return parent.txtColor;
+            },
         },
         txtColor: {
             title: '选择文字颜色',

packages/demo/demo-v2/src/pages/vue-editor/views/editor/viewComponents/Text/propsSchema.js

@@ -4,7 +4,7 @@ pageClass: custom-page-home
 heroImage: /logo.png
 heroText: Vue JSON Schema Form
 tagline: 基于 Vue 、JSON Schema 构建form表单，支持Vue3和多Ui框架
-footer: Apache2.0 Licensed | Copyright © 2020-2020 Jun
+footer: Apache2.0 Licensed | Copyright © 2020-2023 Jun
 actionText: 快速开始 →
 actionLink: /zh/guide/
 ---

packages/docs/docs/README.md

@@ -4,7 +4,7 @@ pageClass: custom-page-home
 heroImage: /logo.png
 heroText: Vue JSON Schema Form
 tagline: Quickly building HTML form based on Vue and JSON Schema
-footer: Apache2.0 Licensed | Copyright © 2020-2020 Jun
+footer: Apache2.0 Licensed | Copyright © 2020-2023 Jun
 # actionText: Quick start →
 # actionLink: /en/guide/
 ---

packages/docs/docs/en/README.md

@@ -121,12 +121,28 @@ export function getUserUiOptions({
 
             // https://github.com/lljj-x/vue-json-schema-form/issues/170
             // ui:hidden需要作为内置属性使用，不能直接透传给widget组件，如果组件需要只能在ui:options 中使用hidden传递
-            if (key !== 'ui:hidden' && key.indexOf('ui:') === 0) {
-                // 只对 ui:xxx 配置形式支持表达式
-                return {
-                    ...options,
-                    [key.substring(3)]: curNodePath === undefined ? value : handleExpression(rootFormData, curNodePath, value, () => value)
-                };
+            if (key !== 'ui:hidden') {
+                // 处理 ui:xxx  参数
+                if (key.indexOf('ui:') === 0) {
+                    // 只对 ui:xxx 配置形式支持表达式
+                    return {
+                        ...options,
+                        [key.substring(3)]: curNodePath === undefined ? value : handleExpression(rootFormData, curNodePath, value, () => value)
+                    };
+                }
+
+                // 处理 fui:xxx 参数，支持所有的options 通过function配置
+                if (key.indexOf('fui:') === 0) {
+                    return {
+                        ...options,
+                        [key.substring(4)]: value.call(
+                            null,
+                            getPathVal(rootFormData, curNodePath, 1),
+                            rootFormData,
+                            curNodePath
+                        )
+                    };
+                }
             }
 
             return options;