d2-container 组件参数改变
Former-commit-id: 18fdc7d4a5007743af012b9095a1187e56d8f559 [formerly 18fdc7d4a5007743af012b9095a1187e56d8f559 [formerly 18fdc7d4a5007743af012b9095a1187e56d8f559 [formerly 18fdc7d4a5007743af012b9095a1187e56d8f559 [formerly 46117b54047460384ae72e63a11d3eecfe977fa4 [formerly fedfe918ba3d14d9b6971d42fda26622650ee5bb]]]]] Former-commit-id: 52722ff9e0c68a14b115b102ef25a2d6a0edeba8 Former-commit-id: 5f64dbf02278730aea38029f3745e495f979faa5 Former-commit-id: 663496b63e988602b572f1efd918f54029e24fc6 [formerly ec9c5fd63dcde126c3144c198ac462b97aafe118] Former-commit-id: 23230faa1f46cab72a52a1082cb06591eda8e648 Former-commit-id: b0361db663017682954b175ec40f6f3fbcda8c1f Former-commit-id: a38dba50e6fccb289648f5e7de15ae3b93218135 Former-commit-id: 3dfac8641e15d0bf98074a5878911476a103a52d Former-commit-id: 03169d27e92a5456e722688bedf8b0d3a305a240
This commit is contained in:
@@ -1 +1 @@
|
|||||||
c7d5a011537457f787c1e920da91703f49725638
|
be315dc4b20db4a72f9543b102c601365693b67d
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
import BScroll from 'better-scroll'
|
import BScroll from 'better-scroll'
|
||||||
export default {
|
export default {
|
||||||
props: {
|
props: {
|
||||||
scrollOptions: {
|
betterScrollOptions: {
|
||||||
type: Object,
|
type: Object,
|
||||||
required: false,
|
required: false,
|
||||||
default: () => ({})
|
default: () => ({})
|
||||||
@@ -26,7 +26,7 @@ export default {
|
|||||||
fade: true,
|
fade: true,
|
||||||
interactive: false
|
interactive: false
|
||||||
}
|
}
|
||||||
}, this.scrollOptions))
|
}, this.betterScrollOptions))
|
||||||
},
|
},
|
||||||
scrollDestroy () {
|
scrollDestroy () {
|
||||||
if (this.BS) {
|
if (this.BS) {
|
||||||
|
|||||||
@@ -1,37 +1,37 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="container-component" ref="container">
|
<div class="container-component" ref="container">
|
||||||
<!-- [card] 卡片容器 -->
|
<!-- [card] 卡片容器 -->
|
||||||
<d2-container-card v-if="type === 'card' && !scroll">
|
<d2-container-card v-if="type === 'card' && !betterScroll">
|
||||||
<slot v-if="$slots.header" name="header" slot="header"/>
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
<slot/>
|
<slot/>
|
||||||
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
</d2-container-card>
|
</d2-container-card>
|
||||||
<!-- [card] 卡片容器 滚动优化 -->
|
<!-- [card] 卡片容器 滚动优化 -->
|
||||||
<d2-container-card-bs v-bind="$attrs" v-if="type === 'card' && scroll">
|
<d2-container-card-bs v-bind="$attrs" v-if="type === 'card' && betterScroll">
|
||||||
<slot v-if="$slots.header" name="header" slot="header"/>
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
<slot/>
|
<slot/>
|
||||||
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
</d2-container-card-bs>
|
</d2-container-card-bs>
|
||||||
<!-- [ghost] 隐形容器 -->
|
<!-- [ghost] 隐形容器 -->
|
||||||
<d2-container-ghost v-if="type === 'ghost' && !scroll">
|
<d2-container-ghost v-if="type === 'ghost' && !betterScroll">
|
||||||
<slot v-if="$slots.header" name="header" slot="header"/>
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
<slot/>
|
<slot/>
|
||||||
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
</d2-container-ghost>
|
</d2-container-ghost>
|
||||||
<!-- [ghost] 隐形容器 滚动优化 -->
|
<!-- [ghost] 隐形容器 滚动优化 -->
|
||||||
<d2-container-ghost-bs v-bind="$attrs" v-if="type === 'ghost' && scroll">
|
<d2-container-ghost-bs v-bind="$attrs" v-if="type === 'ghost' && betterScroll">
|
||||||
<slot v-if="$slots.header" name="header" slot="header"/>
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
<slot/>
|
<slot/>
|
||||||
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
</d2-container-ghost-bs>
|
</d2-container-ghost-bs>
|
||||||
<!-- [container-full] 填充 -->
|
<!-- [container-full] 填充 -->
|
||||||
<d2-container-full v-if="type === 'full' && !scroll">
|
<d2-container-full v-if="type === 'full' && !betterScroll">
|
||||||
<slot v-if="$slots.header" name="header" slot="header"/>
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
<slot/>
|
<slot/>
|
||||||
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
</d2-container-full>
|
</d2-container-full>
|
||||||
<!-- [container-full-bs] 填充 滚动优化 -->
|
<!-- [container-full-bs] 填充 滚动优化 -->
|
||||||
<d2-container-full-bs v-bind="$attrs" v-if="type === 'full' && scroll">
|
<d2-container-full-bs v-bind="$attrs" v-if="type === 'full' && betterScroll">
|
||||||
<slot v-if="$slots.header" name="header" slot="header"/>
|
<slot v-if="$slots.header" name="header" slot="header"/>
|
||||||
<slot/>
|
<slot/>
|
||||||
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
<slot v-if="$slots.footer" name="footer" slot="footer"/>
|
||||||
@@ -49,6 +49,14 @@ import d2ContainerCard from './components/d2-container-card.vue'
|
|||||||
import d2ContainerCardBs from './components/d2-container-card-bs.vue'
|
import d2ContainerCardBs from './components/d2-container-card-bs.vue'
|
||||||
export default {
|
export default {
|
||||||
name: 'd2-container',
|
name: 'd2-container',
|
||||||
|
components: {
|
||||||
|
'd2-container-full': d2ContainerFull,
|
||||||
|
'd2-container-full-bs': d2ContainerFullBs,
|
||||||
|
'd2-container-ghost': d2ContainerGhost,
|
||||||
|
'd2-container-ghost-bs': d2ContainerGhostBs,
|
||||||
|
'd2-container-card': d2ContainerCard,
|
||||||
|
'd2-container-card-bs': d2ContainerCardBs
|
||||||
|
},
|
||||||
props: {
|
props: {
|
||||||
// 容器样式
|
// 容器样式
|
||||||
type: {
|
type: {
|
||||||
@@ -57,19 +65,11 @@ export default {
|
|||||||
default: 'full'
|
default: 'full'
|
||||||
},
|
},
|
||||||
// 滚动优化
|
// 滚动优化
|
||||||
scroll: {
|
betterScroll: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
required: false,
|
required: false,
|
||||||
default: false
|
default: false
|
||||||
}
|
}
|
||||||
},
|
|
||||||
components: {
|
|
||||||
'd2-container-full': d2ContainerFull,
|
|
||||||
'd2-container-full-bs': d2ContainerFullBs,
|
|
||||||
'd2-container-ghost': d2ContainerGhost,
|
|
||||||
'd2-container-ghost-bs': d2ContainerGhostBs,
|
|
||||||
'd2-container-card': d2ContainerCard,
|
|
||||||
'd2-container-card-bs': d2ContainerCardBs
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
29
src/demo.vue
Normal file
29
src/demo.vue
Normal file
@@ -0,0 +1,29 @@
|
|||||||
|
<template>
|
||||||
|
<d2-container type="full" :scroll="false" class="page-name">
|
||||||
|
<template slot="header">header</template>
|
||||||
|
this is [ page-name ]
|
||||||
|
<template slot="footer">footer</template>
|
||||||
|
</d2-container>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'page-name',
|
||||||
|
data () {
|
||||||
|
return {}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import '~@/assets/style/public.scss';
|
||||||
|
.page-name {
|
||||||
|
// Your page style here
|
||||||
|
// Do not use empty rulesets
|
||||||
|
// If the page does not need an additional definition style, please delete
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<d2-container type="card" scroll>
|
<d2-container type="card" better-scroll>
|
||||||
<template slot="header">Header</template>
|
<template slot="header">Header</template>
|
||||||
<d2-demo-article/>
|
<d2-demo-article/>
|
||||||
<template slot="footer">Footer</template>
|
<template slot="footer">Footer</template>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<d2-container scroll>
|
<d2-container better-scroll>
|
||||||
<template slot="header">Header</template>
|
<template slot="header">Header</template>
|
||||||
<d2-demo-article/>
|
<d2-demo-article/>
|
||||||
<template slot="footer">Header</template>
|
<template slot="footer">Header</template>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<d2-container type="ghost" scroll>
|
<d2-container type="ghost" better-scroll>
|
||||||
<template slot="header">Header</template>
|
<template slot="header">Header</template>
|
||||||
<div class="d2-pt d2-pb">
|
<div class="d2-pt d2-pb">
|
||||||
<el-card shadow="never" class="d2-card" style="width: 400px;">
|
<el-card shadow="never" class="d2-card" style="width: 400px;">
|
||||||
|
|||||||
Reference in New Issue
Block a user