@cclr/react-model 0.1.13 → 0.1.15

package/lib/cjs/index.js

@@ -93,29 +93,28 @@ function _unsupportedIterableToArray(r, a) {
 }
 
 /**
- * 获取指定模型的状态和操作
- * @param modelName
+ * 获取精简的模型状态和操作
  * @param model
  * @returns
  */
-var useStore = function useStore(modelName, model) {
+var useSimpleStore = function useSimpleStore(model) {
   var _useState = react.useState({}),
     _useState2 = _slicedToArray(_useState, 2),
     setState = _useState2[1];
   react.useEffect(function () {
-    return model.subscribe(modelName, function () {
+    return model.subscribe(function () {
       setState({});
     });
   }, []);
-  return [model.getState(modelName), model.getActions(modelName)];
+  return [model.getState().value, model.getActions().setValue];
 };
 
 /**
- * 获取精简的模型状态和操作
+ * 获取精简的模型值
  * @param model
  * @returns
  */
-var useSimpleStore = function useSimpleStore(model) {
+var useSimpleValue = function useSimpleValue(model) {
   var _useState3 = react.useState({}),
     _useState4 = _slicedToArray(_useState3, 2),
     setState = _useState4[1];
@@ -124,33 +123,70 @@ var useSimpleStore = function useSimpleStore(model) {
       setState({});
     });
   }, []);
-  return [model.getState().value, model.getActions().setValue];
+  return model.getState().value;
 };
 
 /**
- * 获取精简的模型值
+ * 获取精简的模型值设置
  * @param model
  * @returns
  */
-var useSimpleValue = function useSimpleValue(model) {
-  var _useState5 = react.useState({}),
-    _useState6 = _slicedToArray(_useState5, 2),
-    setState = _useState6[1];
-  react.useEffect(function () {
-    return model.subscribe(function () {
-      setState({});
+var useSimpleSet = function useSimpleSet(model) {
+  return model.getActions().setValue;
+};
+
+/**
+ * 对于对象类型的模型，获取对象的状态和操作
+ * 依赖 ModelSimple
+ * @param model
+ * @returns
+ */
+var useObjStore = function useObjStore(model) {
+  var _useSimpleStore = useSimpleStore(model),
+    _useSimpleStore2 = _slicedToArray(_useSimpleStore, 2),
+    val = _useSimpleStore2[0],
+    set = _useSimpleStore2[1];
+  var handleUpdate = function handleUpdate(key, value) {
+    set(function (prev) {
+      return _objectSpread2(_objectSpread2({}, prev), {}, _defineProperty({}, key, value));
     });
-  }, []);
-  return model.getState().value;
+  };
+  var handleForce = function handleForce(map) {
+    set(map);
+  };
+  var handleDel = function handleDel(keys) {
+    set(function (prev) {
+      var next = _objectSpread2({}, prev);
+      keys.forEach(function (key) {
+        delete next[key];
+      });
+      return next;
+    });
+  };
+  return {
+    value: val,
+    handleUpdate: handleUpdate,
+    handleForce: handleForce,
+    handleDel: handleDel
+  };
 };
 
 /**
- * 获取精简的模型值设置
+ * 获取指定模型的状态和操作
+ * @param modelName
  * @param model
  * @returns
  */
-var useSimpleSet = function useSimpleSet(model) {
-  return model.getActions().setValue;
+var useStore = function useStore(modelName, model) {
+  var _useState = react.useState({}),
+    _useState2 = _slicedToArray(_useState, 2),
+    setState = _useState2[1];
+  react.useEffect(function () {
+    return model.subscribe(modelName, function () {
+      setState({});
+    });
+  }, []);
+  return [model.getState(modelName), model.getActions(modelName)];
 };
 
 var ReactModel = function ReactModel(models) {
@@ -163,6 +199,7 @@ var ReactModel = function ReactModel(models) {
 };
 
 exports.ReactModel = ReactModel;
+exports.useObjStore = useObjStore;
 exports.useSimpleSet = useSimpleSet;
 exports.useSimpleStore = useSimpleStore;
 exports.useSimpleValue = useSimpleValue;

package/lib/esm/index.js

@@ -91,29 +91,28 @@ function _unsupportedIterableToArray(r, a) {
 }
 
 /**
- * 获取指定模型的状态和操作
- * @param modelName
+ * 获取精简的模型状态和操作
  * @param model
  * @returns
  */
-var useStore = function useStore(modelName, model) {
+var useSimpleStore = function useSimpleStore(model) {
   var _useState = useState({}),
     _useState2 = _slicedToArray(_useState, 2),
     setState = _useState2[1];
   useEffect(function () {
-    return model.subscribe(modelName, function () {
+    return model.subscribe(function () {
       setState({});
     });
   }, []);
-  return [model.getState(modelName), model.getActions(modelName)];
+  return [model.getState().value, model.getActions().setValue];
 };
 
 /**
- * 获取精简的模型状态和操作
+ * 获取精简的模型值
  * @param model
  * @returns
  */
-var useSimpleStore = function useSimpleStore(model) {
+var useSimpleValue = function useSimpleValue(model) {
   var _useState3 = useState({}),
     _useState4 = _slicedToArray(_useState3, 2),
     setState = _useState4[1];
@@ -122,33 +121,70 @@ var useSimpleStore = function useSimpleStore(model) {
       setState({});
     });
   }, []);
-  return [model.getState().value, model.getActions().setValue];
+  return model.getState().value;
 };
 
 /**
- * 获取精简的模型值
+ * 获取精简的模型值设置
  * @param model
  * @returns
  */
-var useSimpleValue = function useSimpleValue(model) {
-  var _useState5 = useState({}),
-    _useState6 = _slicedToArray(_useState5, 2),
-    setState = _useState6[1];
-  useEffect(function () {
-    return model.subscribe(function () {
-      setState({});
+var useSimpleSet = function useSimpleSet(model) {
+  return model.getActions().setValue;
+};
+
+/**
+ * 对于对象类型的模型，获取对象的状态和操作
+ * 依赖 ModelSimple
+ * @param model
+ * @returns
+ */
+var useObjStore = function useObjStore(model) {
+  var _useSimpleStore = useSimpleStore(model),
+    _useSimpleStore2 = _slicedToArray(_useSimpleStore, 2),
+    val = _useSimpleStore2[0],
+    set = _useSimpleStore2[1];
+  var handleUpdate = function handleUpdate(key, value) {
+    set(function (prev) {
+      return _objectSpread2(_objectSpread2({}, prev), {}, _defineProperty({}, key, value));
     });
-  }, []);
-  return model.getState().value;
+  };
+  var handleForce = function handleForce(map) {
+    set(map);
+  };
+  var handleDel = function handleDel(keys) {
+    set(function (prev) {
+      var next = _objectSpread2({}, prev);
+      keys.forEach(function (key) {
+        delete next[key];
+      });
+      return next;
+    });
+  };
+  return {
+    value: val,
+    handleUpdate: handleUpdate,
+    handleForce: handleForce,
+    handleDel: handleDel
+  };
 };
 
 /**
- * 获取精简的模型值设置
+ * 获取指定模型的状态和操作
+ * @param modelName
  * @param model
  * @returns
  */
-var useSimpleSet = function useSimpleSet(model) {
-  return model.getActions().setValue;
+var useStore = function useStore(modelName, model) {
+  var _useState = useState({}),
+    _useState2 = _slicedToArray(_useState, 2),
+    setState = _useState2[1];
+  useEffect(function () {
+    return model.subscribe(modelName, function () {
+      setState({});
+    });
+  }, []);
+  return [model.getState(modelName), model.getActions(modelName)];
 };
 
 var ReactModel = function ReactModel(models) {
@@ -160,4 +196,4 @@ var ReactModel = function ReactModel(models) {
   }, model);
 };
 
-export { ReactModel, useSimpleSet, useSimpleStore, useSimpleValue };
+export { ReactModel, useObjStore, useSimpleSet, useSimpleStore, useSimpleValue };

package/lib/type/index.d.ts

@@ -1,4 +1,18 @@
 import { ModelsSingleApi, ModelType, TGetStateType, TGetActionsType, ModelsType, TActionMapApi, TSubscribesFun } from '@cclr/model';
+import { TPlainObject } from '@cclr/lang';
+
+/**
+ * 对于对象类型的模型，获取对象的状态和操作
+ * 依赖 ModelSimple
+ * @param model
+ * @returns
+ */
+declare const useObjStore: <T extends ModelsSingleApi<ModelType>>(model: T) => {
+    value: ReturnType<T["getState"]>["value"];
+    handleUpdate: (key: string, value: any) => void;
+    handleForce: (map: TPlainObject) => void;
+    handleDel: (keys: string[]) => void;
+};
 
 /**
  * 获取精简的模型状态和操作
@@ -37,4 +51,4 @@ type TReactModelsApi<MS extends ModelsType> = {
 
 declare const ReactModel: <MT extends ModelsType>(models: MT) => TReactModelsApi<MT>;
 
-export { ReactModel, useSimpleSet, useSimpleStore, useSimpleValue };
+export { ReactModel, useObjStore, useSimpleSet, useSimpleStore, useSimpleValue };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cclr/react-model",
-  "version": "0.1.13",
+  "version": "0.1.15",
   "description": "前端开发状态管理",
   "author": "cclr <18843152354@163.com>",
   "homepage": "",
@@ -27,14 +27,16 @@
     "g:test": "vitest run",
     "g:build": "ccm lib"
   },
-  "gitHead": "731ccef207bc8ed3120229b2041a42ee9cb5dd7f",
+  "gitHead": "725a0de36f28dadbd785e5c3575d9db26248eaeb",
   "dependencies": {
-    "@cclr/lang": "0.1.12",
-    "@cclr/model": "0.1.12",
-    "@cclr/utils": "0.1.12",
+    "@cclr/lang": "0.1.15",
+    "@cclr/model": "0.1.15",
+    "@cclr/utils": "0.1.15",
+    "immer": "^10.1.1"
+  },
+  "devDependencies": {
     "@testing-library/react-hooks": "^8.0.1",
     "@types/react": "^18.3.12",
-    "immer": "^10.1.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   }