muerwre.github.io/api/_content/query/Llpj9LBd4i.json

{"_path":"/frontend/vue/adding-global-properties-to-component","_dir":"vue","_draft":false,"_partial":false,"_locale":"en","_empty":false,"title":"Adding Global Properties To Component","description":"The topic's fully covered in the official documentation and in Add global variable to window.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The topic's fully covered in the "},{"type":"element","tag":"a","props":{"href":"https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":" and in "},{"type":"element","tag":"a","props":{"href":"Add%20global%20variable%20to%20window"},"children":[{"type":"text","value":"Add global variable to window"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you want to add global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$http"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$translate"}]},{"type":"text","value":" services to all of project's components:"}]},{"type":"element","tag":"code","props":{"code":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n  interface ComponentCustomProperties {\n    $http: typeof axios\n    $translate: (key: string) => string\n  }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n  interface ComponentCustomProperties {\n    $http: typeof axios\n    $translate: (key: string) => string\n  }\n}\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The topic's fully covered in the "},{"type":"element","tag":"a","props":{"href":"https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties","rel":["nofollow"]},"children":[{"type":"text","value":"official documentation"}]},{"type":"text","value":" and in "},{"type":"element","tag":"a","props":{"href":"Add%20global%20variable%20to%20window"},"children":[{"type":"text","value":"Add global variable to window"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For example, you want to add global "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$http"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"$translate"}]},{"type":"text","value":" services to all of project's components:"}]},{"type":"element","tag":"code","props":{"code":"// ~/index.d.ts or ~/custom.d.ts\n\nimport axios from 'axios'\n\ndeclare module 'vue' {\n  interface ComponentCustomProperties {\n    $http: typeof axios\n    $translate: (key: string) => string\n  }\n}\n","language":"typescript"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-22614b"},"children":[{"type":"text","value":"// ~/index.d.ts or ~/custom.d.ts"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-5dae07"},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-b55f51"},"children":[{"type":"text","value":"axios"}]},{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-5dae07"},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d36ee8"},"children":[{"type":"text","value":"'axios'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-074500"},"children":[{"type":"text","value":"declare"}]},{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-074500"},"children":[{"type":"text","value":"module"}]},{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d36ee8"},"children":[{"type":"text","value":"'vue'"}]},{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-074500"},"children":[{"type":"text","value":"interface"}]},{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-4fc9c7"},"children":[{"type":"text","value":"ComponentCustomProperties"}]},{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":" "}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-6e6f7c"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-7aaab2"},"children":[{"type":"text","value":"$translate"}]},{"type":"element","tag":"span","props":{"class":"ct-fa4db5"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-6e6f7c"},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"class":"ct-a606d0"},"children":[{"type":"text","value":"key"}]},{"type":"element","tag":"span","props":{"class":"ct-fa4db5"},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"class":"ct-6e6f7c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10a450"},"children":[{"type":"text","value":"string"}]},{"type":"element","tag":"span","props":{"class":"ct-6e6f7c"},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"class":"ct-63c33d"},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"class":"ct-6e6f7c"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-10a450"},"children":[{"type":"text","value":"string"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":"  }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-7f1b4a"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-63c33d{color:#FF7B72}.ct-10a450{color:#79C0FF}.ct-a606d0{color:#FFA657}.ct-fa4db5{color:#FF7B72}.ct-7aaab2{color:#D2A8FF}.ct-6e6f7c{color:#C9D1D9}.ct-4fc9c7{color:#FFA657}.ct-074500{color:#FF7B72}.ct-d36ee8{color:#A5D6FF}.ct-b55f51{color:#C9D1D9}.ct-7f1b4a{color:#C9D1D9}.ct-5dae07{color:#FF7B72}.ct-22614b{color:#8B949E}.light .ct-22614b{color:#93A1A1}.light .ct-5dae07{color:#859900}.light .ct-7f1b4a{color:#657B83}.light .ct-b55f51{color:#268BD2}.light .ct-d36ee8{color:#2AA198}.light .ct-074500{color:#073642}.light .ct-4fc9c7{color:#268BD2}.light .ct-6e6f7c{color:#657B83}.light .ct-7aaab2{color:#268BD2}.light .ct-fa4db5{color:#859900}.light .ct-a606d0{color:#657B83}.light .ct-10a450{color:#859900}.light .ct-63c33d{color:#073642}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[]}},"_type":"markdown","_id":"content:Frontend:Vue:Adding global properties to component.md","_source":"content","_file":"Frontend/Vue/Adding global properties to component.md","_extension":"md"}