quasar
Version:
Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
48 lines (37 loc) • 1.04 kB
JavaScript
import { h } from 'vue'
import useHydration from '../../composables/use-hydration/use-hydration.js'
import { createComponent } from '../../utils/private.create/create.js'
import { hSlot } from '../../utils/private.render/render.js'
export default createComponent({
name: 'QNoSsr',
props: {
tag: {
type: String,
default: 'div'
},
placeholder: String
},
setup (props, { slots }) {
const { isHydrated } = useHydration()
return () => {
if (isHydrated.value === true) {
const node = hSlot(slots.default)
return node === void 0
? node
: (node.length > 1 ? h(props.tag, {}, node) : node[ 0 ])
}
const data = {
class: 'q-no-ssr-placeholder'
}
const node = hSlot(slots.placeholder)
if (node !== void 0) {
return node.length > 1
? h(props.tag, data, node)
: node[ 0 ]
}
if (props.placeholder !== void 0) {
return h(props.tag, data, props.placeholder)
}
}
}
})