Former-commit-id: 0ad6f5bb845504daf63ce2f5adb5e8b1571c286a [formerly 0ad6f5bb845504daf63ce2f5adb5e8b1571c286a [formerly 0ad6f5bb845504daf63ce2f5adb5e8b1571c286a [formerly 0ad6f5bb845504daf63ce2f5adb5e8b1571c286a [formerly ef20fb943c97b3c99f9e1feba8a209a7641832c6 [formerly 24c967e9e74fe69e32f495cace07a59304d05694]]]]] Former-commit-id: c5f8236960f88c664953456431007da144d61777 Former-commit-id: 53248f297565b5bcbc82dc4c5a8456f5ebe20d08 Former-commit-id: 4bf9d6c1e25515aab11bd1b7b5654babe0bf9386 [formerly a2db5c831a8befa77838003b226177961467debf] Former-commit-id: 02a1af311a8d3af9b14d17511334fcbe28044be1 Former-commit-id: ad7217a65c33f36b4f494c9e0310a4bbe999b60f Former-commit-id: 53720b92060c73f6968cc9ea7e91040e6bf9f81a Former-commit-id: 5abd1948c2df497bed765d73c5512ac697835578 Former-commit-id: cbde2b333113aa29f99059c0fb09844c09b76a43
59 lines
1.8 KiB
Vue
59 lines
1.8 KiB
Vue
<script>
|
|
// 组件
|
|
import d2ContainerFull from './components/d2-container-full.vue'
|
|
import d2ContainerFullBs from './components/d2-container-full-bs.vue'
|
|
import d2ContainerGhost from './components/d2-container-ghost.vue'
|
|
import d2ContainerGhostBs from './components/d2-container-ghost-bs.vue'
|
|
import d2ContainerCard from './components/d2-container-card.vue'
|
|
import d2ContainerCardBs from './components/d2-container-card-bs.vue'
|
|
export default {
|
|
name: 'd2-container',
|
|
props: {
|
|
// 容器样式
|
|
type: {
|
|
type: String,
|
|
required: false,
|
|
default: 'full'
|
|
},
|
|
// 滚动优化
|
|
betterScroll: {
|
|
type: Boolean,
|
|
required: false,
|
|
default: false
|
|
}
|
|
},
|
|
computed: {
|
|
// 始终返回渲染组件
|
|
component () {
|
|
if (this.type === 'card' && !this.betterScroll) return d2ContainerCard
|
|
if (this.type === 'card' && this.betterScroll) return d2ContainerCardBs
|
|
if (this.type === 'ghost' && !this.betterScroll) return d2ContainerGhost
|
|
if (this.type === 'ghost' && this.betterScroll) return d2ContainerGhostBs
|
|
if (this.type === 'full' && !this.betterScroll) return d2ContainerFull
|
|
if (this.type === 'full' && this.betterScroll) return d2ContainerFullBs
|
|
else {
|
|
return 'div'
|
|
}
|
|
}
|
|
},
|
|
render (h) {
|
|
const slots = [
|
|
h('div', this.$slots.default)
|
|
]
|
|
if (this.$slots.header) slots.push(h('div', { slot: 'header' }, [ this.$slots.header ]))
|
|
if (this.$slots.footer) slots.push(h('div', { slot: 'footer' }, [ this.$slots.footer ]))
|
|
return h('div', {
|
|
ref: 'container',
|
|
class: 'container-component'
|
|
}, [
|
|
h(this.component, {
|
|
props: this.$attrs,
|
|
on: {
|
|
scroll: e => this.$emit('scroll', e)
|
|
}
|
|
}, slots)
|
|
])
|
|
}
|
|
}
|
|
</script>
|