Skip to content
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 our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Any content prevents slot component using default value #2347

Closed
qmhc opened this issue Oct 10, 2020 · 2 comments · Fixed by #2485
Closed

Any content prevents slot component using default value #2347

qmhc opened this issue Oct 10, 2020 · 2 comments · Fixed by #2485
Labels
has PR A pull request has already been submitted to solve the issue 🐞 bug Something isn't working

Comments

@qmhc
Copy link

qmhc commented Oct 10, 2020

Version

3.0.0

Reproduction link

https://codesandbox.io/s/cranky-bush-u5qs8?fontsize=14&hidenavigation=1&theme=dark

Steps to reproduce

There is a simple example, you just need to check the elements on the dev tool.

image

image

What is expected?

Default values should be used for invalid content.

What is actually happening?

Any content prevents using default value, also a comment.

@skirtles-code
Copy link
Contributor

It'd be inconsistent between builds too as production builds strip out comments:

vue.global.js: https://jsfiddle.net/skirtle/q78raL1z/1/
vue.global.prod.js: https://jsfiddle.net/skirtle/q78raL1z/

@qmhc
Copy link
Author

qmhc commented Oct 12, 2020

It doesn't work when I want to multiple pass slot between components.

<!-- foo.vue -->
<template>
  <div class="foo">
    <slot :value="value"> current value: {{ value }} </slot>
    <button @click="value += 1">Add</button>
  </div>
</template>

<!-- baz.vue -->
<template>
  <div class="baz">
    <Foo>
      <template #default="{ value }">
        <slot :value="value"></slot>
      </template>
    </Foo>
  </div>
</template>

<!-- App.vue -->
<template>
  <!-- render default value -->
  <Foo></Foo>
  <!-- slot default value not render -->
  <Baz></Baz>
  <!-- render customized value -->
  <Baz>
    <template #default="{ value }">
      customized value: {{ value + 10 }}
    </template>
  </Baz>
</template>

This usage will be used in secondary packaging.

Reproduction link

https://codesandbox.io/s/vigilant-leakey-9bhyv?fontsize=14&hidenavigation=1&theme=dark

@posva posva added the 🐞 bug Something isn't working label Oct 26, 2020
@LinusBorg LinusBorg added the has PR A pull request has already been submitted to solve the issue label Oct 28, 2020
yyx990803 pushed a commit that referenced this issue Nov 26, 2020
@github-actions github-actions bot locked and limited conversation to collaborators Oct 31, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
has PR A pull request has already been submitted to solve the issue 🐞 bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants