{"id":20475678,"url":"https://github.com/dan-almenar/vue-slots-example","last_synced_at":"2025-08-19T18:48:27.423Z","repository":{"id":132526130,"uuid":"466155433","full_name":"dan-almenar/vue-slots-example","owner":"dan-almenar","description":"Guide to Vue slots for exchanging data and functionality between parent and child components","archived":false,"fork":false,"pushed_at":"2022-03-06T12:34:20.000Z","size":111,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-01-16T03:16:31.125Z","etag":null,"topics":["slots","tutorial","vue","vue3"],"latest_commit_sha":null,"homepage":"","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dan-almenar.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-03-04T14:32:13.000Z","updated_at":"2022-03-08T08:59:30.000Z","dependencies_parsed_at":"2023-05-17T10:15:56.952Z","dependency_job_id":null,"html_url":"https://github.com/dan-almenar/vue-slots-example","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dan-almenar%2Fvue-slots-example","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dan-almenar%2Fvue-slots-example/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dan-almenar%2Fvue-slots-example/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dan-almenar%2Fvue-slots-example/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dan-almenar","download_url":"https://codeload.github.com/dan-almenar/vue-slots-example/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242042451,"owners_count":20062411,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["slots","tutorial","vue","vue3"],"created_at":"2024-11-15T15:16:50.596Z","updated_at":"2025-03-05T14:27:47.150Z","avatar_url":"https://github.com/dan-almenar.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# vue-slots-example\n## by [Dan Almenar](https://danielalmenar.com)\n\nThe sole purpose of this mini app is to showcase **possible uses for the Vue \\\u003cslot\\\u003e tag**, not only to add HTML elements to the child component directly from the parent's component \\\u003ctemplate\\\u003e tag, but also to embed other components, or to retrieve data and even functions (methods) from the child component and use them directly on the parent. In no way the components functionality is design as they would in a real project.\n\n\n## Recommended IDE Setup\n\n[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.vscode-typescript-vue-plugin).\n\n## Customize configuration\n\nSee [Vite Configuration Reference](https://vitejs.dev/config/).\n\n## Project Setup\n\n```sh\nnpm install\n```\n\n### Compile and Hot-Reload for Development\n\n```sh\nnpm run dev\n```\n\n### Compile and Minify for Production\n\n```sh\nnpm run build\n```\n\n### Lint with [ESLint](https://eslint.org/)\n\n```sh\nnpm run lint\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdan-almenar%2Fvue-slots-example","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdan-almenar%2Fvue-slots-example","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdan-almenar%2Fvue-slots-example/lists"}