@ithinkdt/naive/src/frame/layout/l-footer.jsx

iThinkDT Naive UI

import { defineComponent, h } from 'vue'

import { cB, CSS_MOUNT_ANCHOR_META_NAME, CSS_STYLE_PREFIX as p } from '@ithinkdt/core/cssr'

export const DtFooter = defineComponent({
    name: 'DtFooter',
    props: {
        content: {
            type: String,
            required: true,
        },
    },
    setup(props) {
        const cls = `${p}-footer`
        createStyle(cls)

        // const auth = inject('__INJECTED_AUTH__')
        // const theme = inject('__INJECTED_THEME__')

        return () => <div class={cls}>{h('span', { innerHTML: props.content })}</div>
    },
})

let style
function createStyle(cls) {
    if (!style) {
        style = cB('footer', {
            textAlign: 'center',
            lineHeight: '32px',
            color: `var(--${p}-placeholder-color)`,
        })

        style.mount({
            id: cls,
            anchorMetaName: CSS_MOUNT_ANCHOR_META_NAME,
        })
    }
}