@hzab/form-render 1.3.1 → 1.3.3

package/CHANGELOG.md

@@ -1,3 +1,11 @@
+# @hzab/form-render@1.3.3
+
+fix: 富文本异步数据问题修复
+
+# @hzab/form-render@1.3.2
+
+fix: schema props 为 schemaScope 字符串的情况
+
 # @hzab/form-render@1.3.1
 
 feat: 表单 onChange 事件（目前仅做触发，值计算后续优化）

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hzab/form-render",
-  "version": "1.3.1",
+  "version": "1.3.3",
   "description": "",
   "main": "src",
   "scripts": {

package/src/common/schema-handler.ts

@@ -19,12 +19,18 @@ export const bindOnChange = (schema, opt) => {
   _schema = _schema.schema || _schema;
   Object.keys(_schema.properties || {})?.forEach((key) => {
     let item = _schema.properties[key];
+    if (!item) {
+      return;
+    }
     const componentName = item["x-component"];
     // 解决 name 丢失的问题
     item.name = key;
 
-    if (item && !item["x-component-props"]) {
+    const comProps = item?.["x-component-props"];
+    if (!comProps) {
       item["x-component-props"] = {};
+    } else if (isScopeKey(comProps)) {
+      item["x-component-props"] = getValByScope(comProps, schemaScope) || {};
     }
 
     const bindParams = {
@@ -91,9 +97,9 @@ export const bindCallback = (opt) => {
       sourceArgs,
     });
     // 触发组件 onChange 事件
-    if (typeof tempFn === "string" && tempFn.startsWith("{{") && tempFn.endsWith("}}")) {
+    if (isScopeKey(tempFn)) {
       // schemaScope 传入方式
-      const fn = schemaScope && schemaScope[tempFn.replace(/^\{\{/, "").replace(/\}\}$/, "")];
+      const fn = schemaScope && schemaScope[getScopeKey(tempFn)];
       typeof fn === "function" && fn(...sourceArgs, res);
     } else if (typeof tempFn === "function") {
       // 直接传入函数的方式
@@ -130,3 +136,41 @@ export const handleChangeValue = (opt) => {
 
   return res;
 };
+
+/**
+ * 是否是 scope key
+ * @param strKey
+ * @returns
+ */
+export const isScopeKey = (strKey) => {
+  if (typeof strKey !== "string") {
+    return false;
+  }
+  const key = strKey.trim();
+  return key.startsWith("{{") && key.endsWith("}}");
+};
+
+/**
+ * 获取 scope key
+ * @param strKey
+ * @returns
+ */
+export const getScopeKey = (strKey) => {
+  if (!isScopeKey(strKey)) {
+    return "";
+  }
+  const key = strKey.trim();
+  return key.replace(/^\{\{/, "").replace(/\}\}$/, "");
+};
+
+/**
+ * 通过字符串获取 schemaScope 中的数据
+ * @param strKey
+ * @param schemaScope
+ * @returns
+ */
+export const getValByScope = (strKey, schemaScope = {}) => {
+  if (isScopeKey(strKey)) {
+    return schemaScope && schemaScope[getScopeKey(strKey)];
+  }
+};

package/src/components/RichEditor/index.tsx

@@ -129,7 +129,6 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
 
   // 及时销毁 editor ，重要！
   useEffect(() => {
-    setEditorContent(value)
     return () => {
       if (editor == null) return;
       editor.destroy();
@@ -137,6 +136,10 @@ export const RichEditor = observer(function (props: PropsType, parentRef) {
     };
   }, [editor]);
 
+  useEffect(() => {
+    setEditorContent(value)
+  }, [value]);
+
   return (
     <>
       <div className="wang-editor-warpper" style={{ zIndex }}>