mirror of
https://github.com/nuxt/nuxt.git
synced 2024-12-05 20:07:16 +00:00
36 lines
736 B
Vue
36 lines
736 B
Vue
|
<template>
|
||
|
<div>
|
||
|
<button class="swap-layout" @click="swapLayout">
|
||
|
swap layout
|
||
|
</button>
|
||
|
<button class="log-foo" @click="logFoo">
|
||
|
log foo
|
||
|
</button>
|
||
|
<button class="log-hello" @click="logHello">
|
||
|
log hello
|
||
|
</button>
|
||
|
<NuxtLayout ref="layout" />
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script setup lang="ts">
|
||
|
const layout = ref()
|
||
|
const currentLayout = useState('current-layout', () => 'custom')
|
||
|
|
||
|
definePageMeta({
|
||
|
layout: 'custom'
|
||
|
})
|
||
|
|
||
|
function logFoo () {
|
||
|
layout.value.layoutRef.logFoo()
|
||
|
}
|
||
|
function logHello () {
|
||
|
layout.value.layoutRef.logHello()
|
||
|
}
|
||
|
|
||
|
function swapLayout () {
|
||
|
currentLayout.value = currentLayout.value === 'custom2' ? 'custom' : 'custom2'
|
||
|
setPageLayout(currentLayout.value)
|
||
|
}
|
||
|
</script>
|