source code button

Former-commit-id: 3632fad2449424c7ac0d9289b0d1cadcc13a95cb [formerly 3632fad2449424c7ac0d9289b0d1cadcc13a95cb [formerly 3632fad2449424c7ac0d9289b0d1cadcc13a95cb [formerly 3632fad2449424c7ac0d9289b0d1cadcc13a95cb [formerly 74cced6cdd9dbf4349a620c4b556d61805cc1c87 [formerly d8c5ac8a9e620b61c6a630a5159eb848cf5b9422]]]]] Former-commit-id: e774159b8321013bec2a12e0e8d69fa664b4e339 Former-commit-id: a60c4307ea5fc8811ed888f3f22124c7aff86948 Former-commit-id: dbdd213f423addf6216abe2be2440811826671e6 [formerly ec78ca6922bd98d9ff7a1e746576a78fb4600359] Former-commit-id: 887313222435ad271cfdb155783e0b6120aa26bf Former-commit-id: a271915674fb1bddaa1abad0e77fbf426b5f626d Former-commit-id: 6f581faa19c84f2def4464c23054ffab5c3c5f2c Former-commit-id: 90753e9c4a80f160dfd174ce954630d16e55b2de Former-commit-id: 509fb7ba39e3a254190525fabe98c96b407e9413
2018-11-15 09:53:33 +08:00
parent f66d009174
commit d4f7a1f6f5
2 changed files with 36 additions and 3 deletions
--- a/src/components/d2-container/index.js
+++ b/src/components/d2-container/index.js
@@ -0,0 +1,59 @@
+// 组件
+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'
+import d2Source from './components/d2-source.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),
+      h(d2Source)
+    ])
+  }
+}