@whitesev/utils 2.10.0 → 2.11.0

package/dist/index.system.js

@@ -242,7 +242,7 @@ System.register('Utils', [], (function (exports) {
             const setInterval$1 = (...args) => loadOrReturnBroker().setInterval(...args);
             const setTimeout$1 = (...args) => loadOrReturnBroker().setTimeout(...args);
 
-            const version = "2.10.0";
+            const version = "2.11.0";
 
             /* eslint-disable */
             // ==UserScript==
@@ -5339,7 +5339,6 @@ System.register('Utils', [], (function (exports) {
                 }
             }
 
-            // @ts-nocheck
             const VueUtils = {
                 /** 标签 */
                 ReactiveFlags: {
@@ -5379,9 +5378,11 @@ System.register('Utils', [], (function (exports) {
                 active = true;
                 fn;
                 scheduler;
-                constructor(fn, scheduler) {
+                options;
+                constructor(fn, scheduler, options) {
                     this.fn = fn;
                     this.scheduler = scheduler;
+                    this.options = options; // 默认值为'same'
                 }
                 run(cb) {
                     if (!this.active) {
@@ -5399,6 +5400,18 @@ System.register('Utils', [], (function (exports) {
                         }
                     }
                 }
+                stop() {
+                    if (this.active) {
+                        // 清除依赖关系
+                        if (this.deps && this.deps.length) {
+                            this.deps.forEach((dep) => {
+                                dep.delete(this);
+                            });
+                            this.deps.length = 0;
+                        }
+                        this.active = false;
+                    }
+                }
             }
             class RefImpl {
                 _value;
@@ -5468,9 +5481,7 @@ System.register('Utils', [], (function (exports) {
                         set(target, key, value, receiver) {
                             const oldValue = target[key];
                             const result = Reflect.set(target, key, value, receiver);
-                            if (oldValue !== value) {
-                                that.trigger(target, "set", key, oldValue, value);
-                            }
+                            that.trigger(target, "set", key, oldValue, value);
                             return result;
                         },
                     });
@@ -5481,8 +5492,9 @@ System.register('Utils', [], (function (exports) {
                  * 观察被reactive的对象值改变
                  * @param source 被观察的对象，这里采用函数返回对象
                  * @param changeCallBack 值改变的回调
+                 * @param options 配置项
                  */
-                watch(source, changeCallBack) {
+                watch(source, changeCallBack, options) {
                     let getter;
                     if (VueUtils.isReactive(source)) {
                         getter = () => this.traversal(source);
@@ -5494,17 +5506,35 @@ System.register('Utils', [], (function (exports) {
                         return;
                     }
                     let oldValue;
+                    const unwatch = () => {
+                        effect.stop();
+                    };
                     const job = () => {
                         const newValue = effect.run((activeEffect) => {
                             this.activeEffect = activeEffect;
                         });
                         changeCallBack(newValue, oldValue);
+                        if (options?.once) {
+                            // 仅触发一次
+                            unwatch();
+                        }
                         oldValue = newValue;
                     };
-                    const effect = new ReactiveEffect(getter, job);
+                    const effect = new ReactiveEffect(getter, job, {
+                        triggerMethod: "not-same",
+                        ...(options ?? {}),
+                    });
                     oldValue = effect.run((activeEffect) => {
                         this.activeEffect = activeEffect;
                     });
+                    if (options) {
+                        if (options.immediate) {
+                            job();
+                        }
+                    }
+                    return {
+                        unwatch,
+                    };
                 }
                 toReactive(value) {
                     return VueUtils.isObject(value) ? this.reactive(value) : value;
@@ -5522,28 +5552,40 @@ System.register('Utils', [], (function (exports) {
                     }
                     return result;
                 }
-                // eslint-disable-next-line @typescript-eslint/no-unused-vars
                 trigger(target, type, key, oldValue, value) {
                     const depsMap = this.targetMap.get(target);
                     if (!depsMap)
                         return;
                     const effects = depsMap.get(key);
-                    this.triggerEffect(effects, "effects");
+                    this.triggerEffect(effects, type, "effects", oldValue, value);
                 }
-                // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                triggerEffect(effects, name) {
+                triggerEffect(effects, _type, _name, oldValue, value) {
                     if (effects) {
+                        const isSame = oldValue === value;
                         effects.forEach((effect) => {
-                            if (effect.scheduler) {
-                                effect.scheduler();
+                            if (effect.options.triggerMethod === "not-same") {
+                                if (isSame) {
+                                    return;
+                                }
+                                if (effect.scheduler) {
+                                    effect.scheduler();
+                                }
+                                else {
+                                    effect.run();
+                                }
                             }
-                            else {
-                                effect.run();
+                            else if (effect.options.triggerMethod === "set") {
+                                if (effect.scheduler) {
+                                    effect.scheduler();
+                                }
+                                else {
+                                    effect.run();
+                                }
                             }
                         });
                     }
                 }
-                track(target, type, key) {
+                track(target, _type, key) {
                     if (!this.activeEffect)
                         return;
                     let depsMap = this.targetMap.get(target);
@@ -8225,14 +8267,39 @@ System.register('Utils', [], (function (exports) {
                 /**
                  * 自定义的动态响应对象
                  * @example
-                 * let vue = new Utils.Vue();
-                 * let reactive = new vue.reactive({});
-                 * vue.watch(()=>reactive["name"], (newValue, oldValue)=>{
+                 * const vue = new Utils.Vue();
+                 * const reactive = vue.reactive({
+                 *   name: "",
+                 * });
+                 * vue.watch(()=>reactive.name, (newValue, oldValue)=>{
+                 *     console.log("newValue ==> " + newValue);
+                 *     console.log("oldValue ==> " + oldValue);
+                 * })
+                 * reactive.name = "测试";
+                 * > newValue ==> 测试
+                 * > oldValue ==>
+                 * reactive.name = "null";
+                 * > newValue ==> null
+                 * > oldValue ==> 测试
+                 * reactive.name = "null";
+                 * @example
+                 * const vue = new Utils.Vue();
+                 * const reactive = vue.reactive({
+                 *   name: "",
+                 * });
+                 * vue.watch(()=>reactive.name, (newValue, oldValue)=>{
                  *     console.log("newValue ==> " + newValue);
                  *     console.log("oldValue ==> " + oldValue);
+                 * },{
+                 *   triggerMethod: "set",
                  * })
-                 * vue["name"] = "测试";
-                 * > "测试"
+                 * reactive.name = "测试";
+                 * > newValue ==> 测试
+                 * > oldValue ==>
+                 * reactive.name = "测试";
+                 * > newValue ==> 测试
+                 * > oldValue ==> 测试
+                 *
                  */
                 Vue = Vue;
                 ModuleRaid = ModuleRaid;