diff --git a/CHANGELOG.md b/CHANGELOG.md index 0e51486..7f1ee0d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,8 +1,40 @@ -## [1.0.21](https://github.com/agileago/vue3-oop/compare/v1.0.20...v1.0.21) (2025-04-04) +# [1.2.0](https://github.com/agileago/vue3-oop/compare/v1.1.2...v1.2.0) (2025-06-05) + + +### Bug Fixes + +* correct provides handling in provideService function ([edf85eb](https://github.com/agileago/vue3-oop/commit/edf85eb2df1bc5d32e138d5af16c61d4943e0e9a)) + + + +## [1.1.2](https://github.com/agileago/vue3-oop/compare/v1.1.1...v1.1.2) (2025-05-20) + + +### Features + +* add If component for conditional rendering ([5f8bd91](https://github.com/agileago/vue3-oop/commit/5f8bd9143aec10e7c00e568fe127fc960b73ba50)) + + + +## [1.1.1](https://github.com/agileago/vue3-oop/compare/v1.1.0...v1.1.1) (2025-05-13) + + +### Performance Improvements + +* 提高性能 ([180a8b3](https://github.com/agileago/vue3-oop/commit/180a8b3ba8819684852ef4a21c85a138c667a2d8)) -## [1.0.20](https://github.com/agileago/vue3-oop/compare/v1.0.19...v1.0.20) (2025-04-04) +# [1.1.0](https://github.com/agileago/vue3-oop/compare/v1.0.21...v1.1.0) (2025-05-12) + + +### Bug Fixes + +* watch不生效 ([2669347](https://github.com/agileago/vue3-oop/commit/266934753d9732216cf0c0967ffaf8865eb1b2c6)) + + + +## [1.0.21](https://github.com/agileago/vue3-oop/compare/v1.0.19...v1.0.21) (2025-04-04) @@ -480,11 +512,6 @@ ## [0.0.6](https://github.com/agileago/vue3-oop/compare/v0.0.5...v0.0.6) (2021-12-04) -### Bug Fixes - -* **模块一:** 更改readme ([94cb61c](https://github.com/agileago/vue3-oop/commit/94cb61c685f1b567f407104a9c6921cbf151b897)) - - ### Features * 增加app获取 ([22d2c31](https://github.com/agileago/vue3-oop/commit/22d2c31e5a1e3fc87c8a8d8627933dff3512e50d)) @@ -494,6 +521,11 @@ ## [0.0.3](https://github.com/agileago/vue3-oop/compare/v0.0.2...v0.0.3) (2021-11-09) +### Bug Fixes + +* **模块一:** 更改readme ([94cb61c](https://github.com/agileago/vue3-oop/commit/94cb61c685f1b567f407104a9c6921cbf151b897)) + + ## [0.0.2](https://github.com/agileago/vue3-oop/compare/553c9af87443170387ae04852cfee4891e2db2ab...v0.0.2) (2021-11-09) diff --git a/package.json b/package.json index e89b039..294c266 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue3-oop", - "version": "1.0.21", + "version": "1.2.0", "packageManager": "pnpm@9.1.1", "engines": { "pnpm": ">=9.0" diff --git a/playground/src/module/basic/simple-component/index.view.tsx b/playground/src/module/basic/simple-component/index.view.tsx index 507f89e..ac471e0 100644 --- a/playground/src/module/basic/simple-component/index.view.tsx +++ b/playground/src/module/basic/simple-component/index.view.tsx @@ -1,4 +1,4 @@ -import { ref } from 'vue' +import { ref, watch } from 'vue' import { defineComponent, useClassAndStyle, type ClassAndStyleProps } from 'vue3-oop' // region 函数组件 @@ -28,6 +28,10 @@ export const SimpleStateComponent = defineComponent(function SimpleStateComponen export const SimpleStateWithDefaultValueComponent = defineComponent( function SimpleStateWithDefaultValueComponent(props: SimpleStateComponentProps, { attrs }) { const classAndStyle = useClassAndStyle() + watch( + () => props.initialValue, + (n, o) => console.log(555555, n, o), + ) const count = ref(props.initialValue || 0) return () => { console.log(2222, props.initialValue, attrs) @@ -41,12 +45,12 @@ export const SimpleStateWithDefaultValueComponent = defineComponent( } }, { - props: { - initialValue: { - type: Number, - default: 20, - }, - }, + // props: { + // initialValue: { + // type: Number, + // default: 20, + // }, + // }, }, ) diff --git a/src/components/index.ts b/src/components/index.ts new file mode 100644 index 0000000..dadc791 --- /dev/null +++ b/src/components/index.ts @@ -0,0 +1,11 @@ +import type { SetupContext } from 'vue' +import type { JSX } from 'vue/jsx-runtime' + +interface IfProps { + /*判断条件*/ + condition: any +} +export function If(props: IfProps, ctx: SetupContext) { + if (!props.condition) return null + return ctx.slots.default?.() as unknown as JSX.Element +} diff --git a/src/di/index.ts b/src/di/index.ts index f27f7eb..e5ef460 100644 --- a/src/di/index.ts +++ b/src/di/index.ts @@ -170,18 +170,31 @@ interface Constructable { constructor: Function } function provideService(...service: T[]) { - const instance = getCurrentInstance()! + const currentInstance = getCurrentInstance()! + // @ts-ignore + let provides = currentInstance.provides + // by default an instance inherits its parent's provides object + // but when it needs to provide values of its own, it creates its + // own provides object using parent provides object as prototype. + // this way in `inject` we can simply look up injections from direct + // parent and let the prototype chain do the work. + // @ts-ignore + const parentProvides = currentInstance.parent && currentInstance.parent.provides + if (parentProvides === provides) { + // @ts-ignore + provides = currentInstance.provides = Object.create(parentProvides) + } // @ts-ignore let injector: ReflectiveInjector - if (Reflect.has(instance, InjectorKey as symbol)) { + if (Object.prototype.hasOwnProperty.call(provides, InjectorKey as symbol)) { // @ts-ignore - injector = instance.provides[InjectorKey] + injector = currentInstance.provides[InjectorKey] } // @ts-ignore if (!injector) { injector = ReflectiveInjector.resolveAndCreate([], inject(InjectorKey)) // @ts-ignore - instance.provides[InjectorKey] = injector + currentInstance.provides[InjectorKey] = injector } ReflectiveInjector.resolve(service.map(k => ({ provide: k.constructor, useValue: k }))).forEach((provider, i) => { diff --git a/src/index.ts b/src/index.ts index 1562404..8ac3c22 100644 --- a/src/index.ts +++ b/src/index.ts @@ -7,6 +7,7 @@ export { Hook } from './decorators/hook' export { createDecorator, getProtoMetadata } from './decorators/util' export * from './helper' export * from './simple-props' +export * from './components' export { Component, InjectorKey, getCurrentInjector, createCurrentInjector, injectService, provideService } from './di' export type { ComponentOptions } from './di' export type { diff --git a/src/simple-props/composables.ts b/src/simple-props/composables.ts index 9b7ad03..b13f400 100644 --- a/src/simple-props/composables.ts +++ b/src/simple-props/composables.ts @@ -3,7 +3,7 @@ import type { ClassAndStyleProps } from '../type' export function camelizePropKey(p: string | symbol): string | symbol { if (typeof p === 'string') { - if (p.startsWith('data-')) return p + if (p.startsWith('data-') || p.startsWith('aria-')) return p return camelize(p) } return p @@ -20,7 +20,7 @@ export function useProps(): T { return Object.fromEntries(Object.entries(instance.vnode.props || {}).map(([k, v]) => [camelizePropKey(k), v])) } - const proxy = new Proxy( + return new Proxy( {}, { get(target, p, receiver) { @@ -34,6 +34,9 @@ export function useProps(): T { // @ts-ignore return instance.props[key] } else { + // eslint-disable-next-line @typescript-eslint/no-unused-expressions + instance.proxy?.$attrs + return Reflect.get(getProps(), key, receiver) } }, @@ -63,8 +66,6 @@ export function useProps(): T { }, }, ) as any - - return proxy } function getSlotName(p: PropertyKey) {