You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
23 lines
609 B
23 lines
609 B
1 year ago
|
import { inject, provide, reactive, watchEffect } from 'vue';
|
||
|
|
|
||
|
|
function createContext<T extends Record<string, any>>(defaultValue?: T) {
|
||
|
|
const contextKey = Symbol('contextKey');
|
||
|
|
const useProvide = (props: T, newProps?: T) => {
|
||
|
|
const mergedProps = reactive<T>({} as T);
|
||
|
|
provide(contextKey, mergedProps);
|
||
|
|
watchEffect(() => {
|
||
|
|
Object.assign(mergedProps, props, newProps || {});
|
||
|
|
});
|
||
|
|
return mergedProps;
|
||
|
|
};
|
||
|
|
const useInject = () => {
|
||
|
|
return inject(contextKey, defaultValue as T) || ({} as T);
|
||
|
|
};
|
||
|
|
return {
|
||
|
|
useProvide,
|
||
|
|
useInject,
|
||
|
|
};
|
||
|
|
}
|
||
|
|
|
||
|
|
export default createContext;
|