feat(runtime-core): support app.config.globalProperties
per https://github.com/vuejs/rfcs/pull/117/
This commit is contained in:
parent
394fd4c6aa
commit
27873dbe1c
@ -440,4 +440,38 @@ describe('api: createApp', () => {
|
||||
).toHaveBeenWarned()
|
||||
})
|
||||
})
|
||||
|
||||
test('config.optionMergeStrategies', () => {
|
||||
let merged: string
|
||||
const App = defineComponent({
|
||||
render() {},
|
||||
mixins: [{ foo: 'mixin' }],
|
||||
extends: { foo: 'extends' },
|
||||
foo: 'local',
|
||||
beforeCreate() {
|
||||
merged = this.$options.foo
|
||||
}
|
||||
})
|
||||
|
||||
const app = createApp(App)
|
||||
app.mixin({
|
||||
foo: 'global'
|
||||
})
|
||||
app.config.optionMergeStrategies.foo = (a, b) => (a ? `${a},` : ``) + b
|
||||
|
||||
app.mount(nodeOps.createElement('div'))
|
||||
expect(merged!).toBe('global,extends,mixin,local')
|
||||
})
|
||||
|
||||
test('config.globalProperties', () => {
|
||||
const app = createApp({
|
||||
render() {
|
||||
return this.foo
|
||||
}
|
||||
})
|
||||
app.config.globalProperties.foo = 'hello'
|
||||
const root = nodeOps.createElement('div')
|
||||
app.mount(root)
|
||||
expect(serializeInner(root)).toBe('hello')
|
||||
})
|
||||
})
|
||||
|
@ -563,28 +563,6 @@ describe('api: options', () => {
|
||||
expect(serializeInner(root)).toBe(`<div>1,1,3</div>`)
|
||||
})
|
||||
|
||||
test('optionMergeStrategies', () => {
|
||||
let merged: string
|
||||
const App = defineComponent({
|
||||
render() {},
|
||||
mixins: [{ foo: 'mixin' }],
|
||||
extends: { foo: 'extends' },
|
||||
foo: 'local',
|
||||
beforeCreate() {
|
||||
merged = this.$options.foo
|
||||
}
|
||||
})
|
||||
|
||||
const app = createApp(App)
|
||||
app.mixin({
|
||||
foo: 'global'
|
||||
})
|
||||
app.config.optionMergeStrategies.foo = (a, b) => (a ? `${a},` : ``) + b
|
||||
|
||||
app.mount(nodeOps.createElement('div'))
|
||||
expect(merged!).toBe('global,extends,mixin,local')
|
||||
})
|
||||
|
||||
describe('warnings', () => {
|
||||
mockWarn()
|
||||
|
||||
|
@ -50,6 +50,7 @@ export interface AppConfig {
|
||||
devtools: boolean
|
||||
performance: boolean
|
||||
optionMergeStrategies: Record<string, OptionMergeFunction>
|
||||
globalProperties: Record<string, any>
|
||||
isCustomElement: (tag: string) => boolean
|
||||
errorHandler?: (
|
||||
err: unknown,
|
||||
@ -86,6 +87,7 @@ export function createAppContext(): AppContext {
|
||||
isNativeTag: NO,
|
||||
devtools: true,
|
||||
performance: false,
|
||||
globalProperties: {},
|
||||
optionMergeStrategies: {},
|
||||
isCustomElement: NO,
|
||||
errorHandler: undefined,
|
||||
|
@ -77,7 +77,15 @@ const enum AccessTypes {
|
||||
|
||||
export const PublicInstanceProxyHandlers: ProxyHandler<any> = {
|
||||
get(target: ComponentInternalInstance, key: string) {
|
||||
const { renderContext, data, propsProxy, accessCache, type, sink } = target
|
||||
const {
|
||||
renderContext,
|
||||
data,
|
||||
propsProxy,
|
||||
accessCache,
|
||||
type,
|
||||
sink,
|
||||
appContext
|
||||
} = target
|
||||
|
||||
// data / props / renderContext
|
||||
// This getter gets called for every property access on the render context
|
||||
@ -118,19 +126,24 @@ export const PublicInstanceProxyHandlers: ProxyHandler<any> = {
|
||||
|
||||
// public $xxx properties & user-attached properties (sink)
|
||||
const publicGetter = publicPropertiesMap[key]
|
||||
let cssModule
|
||||
let cssModule, globalProperties
|
||||
if (publicGetter) {
|
||||
if (__DEV__ && key === '$attrs') {
|
||||
markAttrsAccessed()
|
||||
}
|
||||
return publicGetter(target)
|
||||
} else if (hasOwn(sink, key)) {
|
||||
return sink[key]
|
||||
} else if (
|
||||
(cssModule = type.__cssModules) &&
|
||||
(cssModule = cssModule[key])
|
||||
) {
|
||||
return cssModule
|
||||
} else if (hasOwn(sink, key)) {
|
||||
return sink[key]
|
||||
} else if (
|
||||
((globalProperties = appContext.config.globalProperties),
|
||||
hasOwn(globalProperties, key))
|
||||
) {
|
||||
return globalProperties[key]
|
||||
} else if (__DEV__ && currentRenderingInstance) {
|
||||
warn(
|
||||
`Property ${JSON.stringify(key)} was accessed during render ` +
|
||||
|
Loading…
Reference in New Issue
Block a user