Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-22 05:35:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(nuxt): handle multi-line slots in islands (#24212)

Browse Source
This commit is contained in:
Daniel Roe 2023-11-09 14:45:45 +01:00 committed by GitHub
parent bb533f8d25
commit c3cf55d963
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/nuxt/src/components/islandsTransform.ts
View File

@ -97,7 +97,7 @@ function isBinding (attr: string): boolean {
function getBindings (bindings: Record<string, string>, vfor?: [string, string]): string {
if (Object.keys(bindings).length === 0) { return '' }
const content = Object.entries(bindings).filter(b => b[0] !== '_bind').map(([name, value]) => isBinding(name) ? `${name.slice(1)}: ${value}` : `${name}: \`${value}\``).join(',')
const content = Object.entries(bindings).filter(b => b[0] && b[0] !== '_bind').map(([name, value]) => isBinding(name) ? `${name.slice(1)}: ${value}` : `${name}: \`${value}\``).join(',')
const data = bindings._bind ? `mergeProps(${bindings._bind}, { ${content} })` : `{ ${content} }`
if (!vfor) {
return `:nuxt-ssr-slot-data="JSON.stringify([${data}])"`

21
packages/nuxt/test/islandTransform.test.ts
View File

@ -34,11 +34,15 @@ describe('islandTransform - server and island components', () => {
<slot />
<slot name="named" :some-data="someData" />
<slot
name="other"
:some-data="someData"
/>
</div>
</template>
<script setup lang="ts">
const someData = 'some data'
</script>`
, 'hello.server.vue')
@ -48,12 +52,13 @@ describe('islandTransform - server and island components', () => {
<div style=\\"display: contents;\\" nuxt-ssr-slot-name=\\"default\\" />
<div style=\\"display: contents;\\" nuxt-ssr-slot-name=\\"named\\" :nuxt-ssr-slot-data=\\"JSON.stringify([{ some-data: someData }])\\"/>
<div style=\\"display: contents;\\" nuxt-ssr-slot-name=\\"other\\" :nuxt-ssr-slot-data=\\"JSON.stringify([{ some-data: someData }])\\"/>
</div>
</template>
<script setup lang=\\"ts\\">
import { vforToArray as __vforToArray } from '#app/components/utils'
const someData = 'some data'
</script>"
`)
})
@ -68,7 +73,7 @@ describe('islandTransform - server and island components', () => {
</template>
<script setup lang="ts">
const someData = 'some data'
</script>`
, 'hello.server.vue')
@ -83,7 +88,7 @@ describe('islandTransform - server and island components', () => {
<script setup lang=\\"ts\\">
import { vforToArray as __vforToArray } from '#app/components/utils'
const someData = 'some data'
</script>"
`)
})
@ -109,13 +114,13 @@ describe('islandTransform - server and island components', () => {
</UCard>
</div>
</template>
<script setup lang="ts">
export interface Props {
count?: number;
}
const props = withDefaults(defineProps<Props>(), { count: 0 });
const message = "Hello World";
</script>
`
@ -142,14 +147,14 @@ describe('islandTransform - server and island components', () => {
</UCard>
</div>
</template>
<script setup lang=\\"ts\\">
import { vforToArray as __vforToArray } from '#app/components/utils'
export interface Props {
count?: number;
}
const props = withDefaults(defineProps<Props>(), { count: 0 });
const message = \\"Hello World\\";
</script>
"