@ismartify/reactive
Advanced tools
+1
-1
@@ -1,1 +0,1 @@ | ||
| "use strict";var f=Object.create;var s=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,R=Object.prototype.hasOwnProperty;var m=(r,t)=>{for(var n in t)s(r,n,{get:t[n],enumerable:!0})},p=(r,t,n,d)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of u(t))!R.call(r,o)&&o!==n&&s(r,o,{get:()=>t[o],enumerable:!(d=g(t,o))||d.enumerable});return r};var e=(r,t,n)=>(n=r!=null?f(y(r)):{},p(t||!r||!r.__esModule?s(n,"default",{value:r,enumerable:!0}):n,r)),l=r=>p(s({},"__esModule",{value:!0}),r);var x={};m(x,{ISmartifyReactive:()=>i,default:()=>T,get:()=>a.default,isReactive:()=>h,pick:()=>c.default,set:()=>_.default});module.exports=l(x);var a=e(require("lodash/get"),1),_=e(require("lodash/set"),1),c=e(require("lodash/pick"),1);function h(r){return r===null||typeof r!="object"?!1:!!r.__v_isReactive}var i=class{#t={};constructor(t){if(!t||!h(t))throw new Error("\u4F20\u5165\u7684\u5BF9\u8C61\u5FC5\u987B\u662F\u54CD\u5E94\u5F0F\u7684");this.#t=t||{},this.set("__version","ismartify-reactive@1.0.0")}raw=()=>this.#t;get=(t,n)=>(0,a.default)(this.#t,t,n);set=(t,n)=>((0,_.default)(this.#t,t,n),this);pick=t=>(0,c.default)(this.#t,t);tap(t){return(t||console.log)(this.#t),this}exec(t){return t(this),this}},T=i;0&&(module.exports={ISmartifyReactive,get,isReactive,pick,set}); | ||
| "use strict";var _=Object.create;var o=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var T=Object.getOwnPropertyNames;var d=Object.getPrototypeOf,l=Object.prototype.hasOwnProperty;var R=(r,t)=>{for(var n in t)o(r,n,{get:t[n],enumerable:!0})},f=(r,t,n,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of T(t))!l.call(r,i)&&i!==n&&o(r,i,{get:()=>t[i],enumerable:!(s=g(t,i))||s.enumerable});return r};var c=(r,t,n)=>(n=r!=null?_(d(r)):{},f(t||!r||!r.__esModule?o(n,"default",{value:r,enumerable:!0}):n,r)),m=r=>f(o({},"__esModule",{value:!0}),r);var x={};R(x,{ISmartifyReactive:()=>a,default:()=>p,get:()=>e.default,isReactive:()=>u,pick:()=>y.default,set:()=>h.default});module.exports=m(x);var e=c(require("lodash/get"),1),h=c(require("lodash/set"),1),y=c(require("lodash/pick"),1);function u(r){return r===null||typeof r!="object"?!1:!!r.__v_isReactive}var a=class{#t={};constructor(t){if(!t||!u(t))throw new Error("\u4F20\u5165\u7684\u5BF9\u8C61\u5FC5\u987B\u662F\u54CD\u5E94\u5F0F\u7684");this.#t=t||{},this.set("__version","ismartify-reactive@1.0.0")}raw=()=>this.#t;get=(t,n)=>(0,e.default)(this.#t,t,n);set=(t,n)=>((0,h.default)(this.#t,t,n),this);pick=t=>{if(typeof t=="string")return{[t]:(0,e.default)(this.#t,t)};{let n={};return t.forEach(s=>{n[s]=(0,e.default)(this.#t,s)}),n}};tap(t){return(t||console.log)(this.#t),this}mixin=(t,n)=>{let s=function(...i){return n(this,...i)};return this.set(`__functions.${t}`,s),this};call=(t,...n)=>{let s=this.get(`__functions.${t}`);if(!s)throw new Error(`Function ${t} not found in mixin`);return s.call(this,...n)};exec=(t,...n)=>t(this,...n)},p=a;0&&(module.exports={ISmartifyReactive,get,isReactive,pick,set}); |
+3
-1
@@ -15,5 +15,7 @@ export { default as get } from 'lodash/get'; | ||
| tap(fn?: (store: Record<string, any>) => void): this; | ||
| exec(fn: (store: Record<string, any>) => void): this; | ||
| mixin: (name: string, fn: Function) => this; | ||
| call: <T extends (...args: any[]) => any>(name: string, ...args: Parameters<T>) => ReturnType<T>; | ||
| exec: <T extends (self: this, ...args: any[]) => any>(callback: T, ...args: any[]) => ReturnType<T>; | ||
| } | ||
| export { ISmartifyReactive, ISmartifyReactive as default, isReactive }; |
+3
-1
@@ -15,5 +15,7 @@ export { default as get } from 'lodash/get'; | ||
| tap(fn?: (store: Record<string, any>) => void): this; | ||
| exec(fn: (store: Record<string, any>) => void): this; | ||
| mixin: (name: string, fn: Function) => this; | ||
| call: <T extends (...args: any[]) => any>(name: string, ...args: Parameters<T>) => ReturnType<T>; | ||
| exec: <T extends (self: this, ...args: any[]) => any>(callback: T, ...args: any[]) => ReturnType<T>; | ||
| } | ||
| export { ISmartifyReactive, ISmartifyReactive as default, isReactive }; |
+1
-1
@@ -1,1 +0,1 @@ | ||
| import i from"lodash/get";import e from"lodash/set";import h from"lodash/pick";function s(r){return r===null||typeof r!="object"?!1:!!r.__v_isReactive}var o=class{#t={};constructor(t){if(!t||!s(t))throw new Error("\u4F20\u5165\u7684\u5BF9\u8C61\u5FC5\u987B\u662F\u54CD\u5E94\u5F0F\u7684");this.#t=t||{},this.set("__version","ismartify-reactive@1.0.0")}raw=()=>this.#t;get=(t,n)=>i(this.#t,t,n);set=(t,n)=>(e(this.#t,t,n),this);pick=t=>h(this.#t,t);tap(t){return(t||console.log)(this.#t),this}exec(t){return t(this),this}},f=o;export{o as ISmartifyReactive,f as default,i as get,s as isReactive,h as pick,e as set}; | ||
| import i from"lodash/get";import c from"lodash/set";import _ from"lodash/pick";function o(s){return s===null||typeof s!="object"?!1:!!s.__v_isReactive}var e=class{#t={};constructor(t){if(!t||!o(t))throw new Error("\u4F20\u5165\u7684\u5BF9\u8C61\u5FC5\u987B\u662F\u54CD\u5E94\u5F0F\u7684");this.#t=t||{},this.set("__version","ismartify-reactive@1.0.0")}raw=()=>this.#t;get=(t,n)=>i(this.#t,t,n);set=(t,n)=>(c(this.#t,t,n),this);pick=t=>{if(typeof t=="string")return{[t]:i(this.#t,t)};{let n={};return t.forEach(r=>{n[r]=i(this.#t,r)}),n}};tap(t){return(t||console.log)(this.#t),this}mixin=(t,n)=>{let r=function(...a){return n(this,...a)};return this.set(`__functions.${t}`,r),this};call=(t,...n)=>{let r=this.get(`__functions.${t}`);if(!r)throw new Error(`Function ${t} not found in mixin`);return r.call(this,...n)};exec=(t,...n)=>t(this,...n)},T=e;export{e as ISmartifyReactive,T as default,i as get,o as isReactive,_ as pick,c as set}; |
+120
-3
@@ -208,6 +208,123 @@ ================ | ||
| // Correct usage with reactive object | ||
| -------------------------------- | ||
| TITLE: Adding Custom Methods with Mixin (TypeScript) | ||
| DESCRIPTION: This TypeScript code demonstrates how to add custom methods to the reactive store using the mixin method. Mixins allow extending the store with custom functionality while maintaining chainability. | ||
| SOURCE: https://github.com/ismartify/core/packages/ismartify-reactive/src/index.ts | ||
| LANGUAGE: typescript | ||
| CODE: | ||
| ```typescript | ||
| // Add custom methods using mixin | ||
| store | ||
| .mixin('increment', function(self, amount = 1) { | ||
| const current = self.get('counter'); | ||
| self.set('counter', current + amount); | ||
| return self.get('counter'); | ||
| }) | ||
| .mixin('getStats', function(self) { | ||
| return { | ||
| counter: self.get('counter'), | ||
| doubled: self.get('counter') * 2 | ||
| }; | ||
| }); | ||
| // Call the mixed-in methods | ||
| const newValue = store.call('increment', 5); // returns 5 | ||
| const stats = store.call('getStats'); // returns { counter: 5, doubled: 10 } | ||
| ``` | ||
| -------------------------------- | ||
| TITLE: Executing Complex Logic with Exec Method (TypeScript) | ||
| DESCRIPTION: This snippet shows how to use the exec method to execute complex operations within the reactive store context. The exec method provides access to the store instance and can return computed values. | ||
| SOURCE: https://github.com/ismartify/core/packages/ismartify-reactive/src/index.ts | ||
| LANGUAGE: typescript | ||
| CODE: | ||
| ```typescript | ||
| // Execute complex business logic | ||
| const result = store.exec((self) => { | ||
| const current = self.get('counter'); | ||
| const history = self.get('history', []); | ||
| // Perform multiple operations | ||
| const newValue = current + 10; | ||
| self.set('counter', newValue); | ||
| self.set('history', [...history, newValue]); | ||
| // Return computed result | ||
| return { | ||
| previous: current, | ||
| current: newValue, | ||
| change: newValue - current | ||
| }; | ||
| }); | ||
| console.log(result); // { previous: 0, current: 10, change: 10 } | ||
| ``` | ||
| -------------------------------- | ||
| TITLE: Complete Application Example with Mixins (TypeScript) | ||
| DESCRIPTION: This comprehensive TypeScript example demonstrates building a complete todo application using ISmartifyReactive with custom mixins for business logic, showcasing the full power of the reactive store pattern. | ||
| SOURCE: https://github.com/ismartify/core/packages/ismartify-reactive/test/app-examples.test.ts | ||
| LANGUAGE: typescript | ||
| CODE: | ||
| ```typescript | ||
| import { reactive } from '@vue/reactivity'; | ||
| const reactiveObject = reactive({ name: 'test' }); | ||
| const store = new ISmartifyReactive(reactiveObject); // ✅ Works | ||
| import { ISmartifyReactive } from '@ismartify/reactive'; | ||
| // Create reactive state | ||
| const state = reactive({ | ||
| todos: [] as Array<{ id: number; text: string; completed: boolean }>, | ||
| filter: 'all', | ||
| nextId: 1 | ||
| }); | ||
| const store = new ISmartifyReactive(state); | ||
| // Add business logic methods | ||
| store | ||
| .mixin('addTodo', function(self, text: string) { | ||
| const newTodo = { | ||
| id: self.get('nextId'), | ||
| text, | ||
| completed: false | ||
| }; | ||
| self.set('todos', [...self.get('todos'), newTodo]); | ||
| self.set('nextId', self.get('nextId') + 1); | ||
| return newTodo; | ||
| }) | ||
| .mixin('toggleTodo', function(self, id: number) { | ||
| const todos = self.get('todos'); | ||
| const updated = todos.map(todo => | ||
| todo.id === id ? { ...todo, completed: !todo.completed } : todo | ||
| ); | ||
| self.set('todos', updated); | ||
| return updated.find(todo => todo.id === id); | ||
| }) | ||
| .mixin('getFilteredTodos', function(self) { | ||
| const todos = self.get('todos'); | ||
| const filter = self.get('filter'); | ||
| switch (filter) { | ||
| case 'active': return todos.filter(todo => !todo.completed); | ||
| case 'completed': return todos.filter(todo => todo.completed); | ||
| default: return todos; | ||
| } | ||
| }); | ||
| // Use the application | ||
| store.call('addTodo', 'Learn TypeScript'); | ||
| store.call('addTodo', 'Build reactive app'); | ||
| store.call('toggleTodo', 1); | ||
| store.set('filter', 'active'); | ||
| const activeTodos = store.call('getFilteredTodos'); | ||
| console.log('Active todos:', activeTodos); | ||
| ``` |
+2
-2
| { | ||
| "name": "@ismartify/reactive", | ||
| "version": "1.0.3", | ||
| "version": "1.0.4", | ||
| "description": "", | ||
@@ -23,3 +23,3 @@ "type": "module", | ||
| "scripts": { | ||
| "test": "vitest", | ||
| "test": "vitest run", | ||
| "build": "tsup", | ||
@@ -26,0 +26,0 @@ "ver+": "npm version patch", |
+42
-0
@@ -129,2 +129,44 @@ # ISmartify Reactive | ||
| ##### `mixin<T>(name: string, fn: (self: this, ...args: any[]) => T): this` | ||
| 添加自定义方法到存储实例,返回实例本身支持链式调用。 | ||
| ```typescript | ||
| // 添加自定义方法 | ||
| store.mixin('double', function(self, multiplier = 2) { | ||
| const current = self.get('value'); | ||
| return current * multiplier; | ||
| }); | ||
| // 链式调用 | ||
| store.mixin('reset', function(self) { | ||
| self.set('value', 0); | ||
| return '已重置'; | ||
| }); | ||
| ``` | ||
| ##### `call<T>(name: string, ...args: any[]): T` | ||
| 调用通过 mixin 方法添加的自定义函数。 | ||
| ```typescript | ||
| // 调用混入的方法 | ||
| const result = store.call('double', 3); // 返回 30 | ||
| const resetMsg = store.call('reset'); // 返回 '已重置' | ||
| ``` | ||
| ##### `exec<T>(fn: (self: this) => T): T` | ||
| 执行回调函数,可以在回调中操作存储并返回结果。 | ||
| ```typescript | ||
| // 执行复杂逻辑 | ||
| const result = store.exec((self) => { | ||
| const current = self.get('counter'); | ||
| self.set('counter', current + 10); | ||
| self.set('history', [...self.get('history'), current + 10]); | ||
| return `计数器更新为: ${current + 10}`; | ||
| }); | ||
| ``` | ||
| ##### `raw(): Record<string, any>` | ||
@@ -131,0 +173,0 @@ |
21382
36.94%28
16.67%243
20.9%