Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings
/docsPublic

Try to improve Dynamic Slot Names documentation#3038

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Open
dtechmaster wants to merge1 commit intovuejs:main
base:main
Choose a base branch
Loading
fromdtechmaster:patch-1

Conversation

@dtechmaster
Copy link

Sure! Here's a suggested pull request message that you can use:


Title: Improve Documentation for Dynamic Slot Names by Adding Declaration Examples

Description:

This pull request enhances theDynamic Slot Names section of the Vue.js documentation by providing explanations and examples on how todeclare dynamic slots in child components, not just how to use them in parent components.


Description of Problem

The current documentation forDynamic Slot Names focuses primarily on how to use dynamic slot names in theparent component usingv-slot with dynamic arguments. It lacks information on how todeclare dynamic slots in thechild component. This omission can lead to confusion, as understanding both declaration and usage is essential for implementing dynamic slots effectively.

Proposed Solution

  • Added Explanation: Introduced a subsection that explains how to declare dynamic slots in child components using the:name binding on the<slot> element.
  • Examples with Composition API: Provided examples using<script setup> and the Composition API to align with modern Vue.js practices.
  • Static and Dynamic Usage: Illustrated both static and dynamic ways of providing slot content in parent components.
  • Practical Example: Included a practical example that mirrors common use cases, making it easier for developers to understand and implement dynamic slots.
  • Important Notes: Highlighted crucial points such as matching slot names between parent and child components and handling fallback content.

Additional Information

  • Consistency: Ensured that the new content follows the existing documentation style and guidelines.
  • Clarity: Kept explanations concise to maintain readability while providing enough detail for comprehension.
  • Reusability: The examples can be easily adapted by developers for their own projects.

Propose explanation on how to declare Dynamic Slot Names and not only on how to use them.
@netlify
Copy link

netlifybot commentedSep 26, 2024
edited
Loading

Deploy Preview forvuejs ready!

NameLink
🔨 Latest commite7e5e7d
🔍 Latest deploy loghttps://app.netlify.com/sites/vuejs/deploys/66f512b0435f1c0008c587b5
😎 Deploy Previewhttps://deploy-preview-3038--vuejs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to yourNetlify site configuration.

</ChildComponent>
</template>
<script setup>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

suggestion: we need to wrap this in<div></div> and write the matching code for Options API

<script setup>
import ChildComponent from './ChildComponent.vue';
const slotNames = ['header', 'footer'];

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

Same note as above about the Options API

Sign up for freeto join this conversation on GitHub. Already have an account?Sign in to comment

Reviewers

@NataliaTepluhinaNataliaTepluhinaNataliaTepluhina requested changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@dtechmaster@NataliaTepluhina

[8]ページ先頭

©2009-2025 Movatter.jp