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.
47 lines
1.1 KiB
47 lines
1.1 KiB
import { renderSlot } from "vue"
|
|
import ProviderComp from "./Provider.uvue"
|
|
import ConsumerComp from "./Consumer.uvue"
|
|
|
|
interface IProps {
|
|
value : object
|
|
}
|
|
|
|
type ContextValue = {
|
|
Provider : any
|
|
useContext : () => any
|
|
Consumer : any
|
|
}
|
|
|
|
type TCreateContext = (key : string) => ContextValue
|
|
|
|
export const createContext : TCreateContext = (key) => {
|
|
const useContext : () => any = () : any => {
|
|
return inject(key) as any
|
|
}
|
|
// const Consumer = {
|
|
// setup() {
|
|
// const slots = useSlots()
|
|
// const data = useContext()
|
|
// const FN : () => VNode = () => renderSlot(slots, 'default', data)
|
|
// return () : VNode => h(FN, {})
|
|
// }
|
|
// }
|
|
|
|
// const FnC = Consumer
|
|
|
|
const value : ContextValue = {
|
|
Provider: (): VNode=> {
|
|
return h(ProviderComp, { contextKey: key },)
|
|
},
|
|
useContext,
|
|
Consumer: h(ConsumerComp, { contextKey: key }),
|
|
// Consumer: (): VNode=>{
|
|
// const slots = useSlots()
|
|
// const data = useContext()
|
|
// // const FN : () => VNode = () => renderSlot(slots, 'default', data)
|
|
// console.log(data);
|
|
// return renderSlot(slots, 'default', data)
|
|
// }
|
|
}
|
|
return value
|
|
}
|