File tree Expand file tree Collapse file tree 1 file changed +4
-37
lines changed Expand file tree Collapse file tree 1 file changed +4
-37
lines changed Original file line number Diff line number Diff line change @@ -871,6 +871,10 @@ With above example component hierarchy, in order to derive data from `parent-com
871
871
872
872
### Provide / Inject
873
873
874
+ ::: tip
875
+ You can also use [ vue-property-decorator] ( https://github.com/kaorun343/vue-property-decorator ) 's ` @Provide ` , ` @Inject `
876
+ :::
877
+
874
878
``` js
875
879
// ThemeProvider
876
880
@@ -931,43 +935,6 @@ export default {
931
935
<ThemeButton secondary >Themed Button</ThemeButton >
932
936
</ThemeProvider >
933
937
934
- ### [ @Provide / @Inject Decorator] ( https://github.com/kaorun343/vue-property-decorator )
935
-
936
- ``` js
937
- // ParentComponent.vue
938
-
939
- import { Component , Vue , Provide } from ' vue-property-decorator' ;
940
-
941
- @Component
942
- export class ParentComponent extends Vue {
943
- @Provide
944
- theme = {
945
- primaryColor: ' blue' ,
946
- };
947
- }
948
- ```
949
-
950
- ``` vue
951
- // GrandChildComponent.vue
952
-
953
- <template>
954
- <button :style="{ backgroundColor: primary && theme.primaryColor }">
955
- <slot></slot>
956
- </button>
957
- </template>
958
-
959
- <script>
960
- import { Component, Vue, Inject, Prop } from 'vue-property-decorator';
961
-
962
- export class GrandChildComponent extends Vue {
963
- @Inject() theme;
964
-
965
- @Prop({ default: true })
966
- primary: boolean;
967
- }
968
- </script>
969
- ```
970
-
971
938
## Handling Errors
972
939
973
940
### ` errorCaptured ` Hook
You can’t perform that action at this time.
0 commit comments