File size: 1,136 Bytes
4d70170 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 |
<script>
import { inject, provide } from 'vue'
const symbolForInject = Symbol('inject')
const symbolForSetup = Symbol('setup')
export default {
components: {
Inject: {
name: 'Inject',
components: {
NestedInject: {
name: 'NestedInject',
inject: {
renamed: 'injectedData',
missing: {
from: 'missingInjected',
default: () => ({ answer: 42 }),
},
},
template: '<div>nested inject: {{ renamed }} missing: {{ missing }}</div>',
},
},
inject: ['injectedData', symbolForInject],
setup() {
return {
comingFromSetup: inject('fromSetup'),
comingFromSymbol: inject(symbolForSetup),
}
},
template: '<div>injected: {{ injectedData }} | {{ comingFromSetup }}<NestedInject /></div>',
},
},
provide() {
return {
injectedData: 'bar',
[symbolForInject]: 'foo',
}
},
setup() {
provide('fromSetup', 'Setup!!')
provide(symbolForSetup, 'Symbol from Setup')
},
}
</script>
<template>
<Inject />
</template>
|