2022-11-24 12:24:14 +00:00
|
|
|
<script setup lang="ts">
|
2024-09-11 19:20:35 +00:00
|
|
|
|
2022-11-24 12:24:14 +00:00
|
|
|
const islandProps = ref({
|
|
|
|
bool: true,
|
|
|
|
number: 100,
|
2024-04-23 12:53:11 +00:00
|
|
|
str: 'hello world',
|
2024-04-05 18:08:32 +00:00
|
|
|
obj: { json: 'works' },
|
2022-11-24 12:24:14 +00:00
|
|
|
})
|
|
|
|
|
2023-05-15 22:43:53 +00:00
|
|
|
const showIslandSlot = ref(false)
|
2022-11-24 12:24:14 +00:00
|
|
|
const routeIslandVisible = ref(false)
|
2023-05-15 22:43:53 +00:00
|
|
|
const testCount = ref(0)
|
2023-03-20 21:47:06 +00:00
|
|
|
const count = ref(0)
|
2022-11-24 12:24:14 +00:00
|
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
|
|
|
<div>
|
|
|
|
Pure island component:
|
2024-09-11 19:20:35 +00:00
|
|
|
|
|
|
|
|
2023-05-15 22:43:53 +00:00
|
|
|
<AsyncServerComponent :count="count">
|
|
|
|
<div id="slot-in-server">
|
|
|
|
Slot with in .server component
|
|
|
|
</div>
|
|
|
|
</AsyncServerComponent>
|
2024-09-11 19:20:35 +00:00
|
|
|
|
2022-11-24 12:24:14 +00:00
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
.box {
|
|
|
|
border: 1px solid black;
|
|
|
|
margin: 3px;
|
|
|
|
display: flex;
|
|
|
|
}
|
|
|
|
</style>
|