From 87c343e461a3c9b9dcba94dd23ef95b69f75d002 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B4=94=E7=90=BC=E9=9B=AA?= <cuiqiongxue@doumi.com>
Date: Fri, 15 Dec 2017 15:40:41 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E9=80=BB=E8=BE=91=EF=BC=9A?=
 =?UTF-8?q?=201.=E5=BD=93=E5=90=B8=E9=A1=B6=E7=9A=84=E6=97=B6=E5=80=99?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E4=B8=80=E4=B8=AAdiv=E6=A0=87=E7=AD=BE?=
 =?UTF-8?q?=E5=8D=A0=E4=BD=8D=EF=BC=8C=E5=8F=AF=E8=AE=A9=E8=BF=87=E5=BA=A6?=
 =?UTF-8?q?=E6=9B=B4=E5=8A=A0=E9=A1=BA=E6=BB=91=EF=BC=88=E5=8E=9F=E6=9C=89?=
 =?UTF-8?q?=E9=80=BB=E8=BE=91=E5=BD=93=E5=88=B0=E8=BE=BE=E9=A1=B6=E9=83=A8?=
 =?UTF-8?q?=E7=9A=84=E6=97=B6=E5=80=99=E4=BC=9A=E4=BC=9A=E5=8F=98=E6=88=90?=
 =?UTF-8?q?=E7=BB=9D=E5=AF=B9=E5=AE=9A=E4=BD=8D=EF=BC=8C=E5=90=8E=E9=9D=A2?=
 =?UTF-8?q?=E7=9A=84=E6=A0=87=E7=AD=BE=E5=B0=B1=E4=BC=9A=E7=AB=8B=E5=8D=B3?=
 =?UTF-8?q?=E9=A1=B6=E4=B8=8A=E5=8E=BB=EF=BC=8C=E4=BC=9A=E6=9C=89=E8=B7=B3?=
 =?UTF-8?q?=E5=8A=A8=E7=9A=84=E8=BF=87=E7=A8=8B=EF=BC=8C=E4=BD=93=E9=AA=8C?=
 =?UTF-8?q?=E4=B8=8D=E4=BD=B3=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 examples/routers/affix.vue     | 16 ++++++++++++++--
 src/components/affix/affix.vue | 14 ++++++++++++--
 2 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/examples/routers/affix.vue b/examples/routers/affix.vue
index fe38a9cb..ca6f8dea 100644
--- a/examples/routers/affix.vue
+++ b/examples/routers/affix.vue
@@ -10,12 +10,24 @@
     }
 </style>
 <template>
+<div>
     <Affix>
-        <span class="demo-affix">固定在最顶部</span>
+        <div class="demo-affix">固定在最顶部</div>
     </Affix>
+    <div v-for="(item,index) in arr">{{item}}</div>
+</div>
 </template>
 <script>
     export default {
-
+        data(){
+            return {
+                arr: []
+            }
+        },
+        created(){
+            for(let i = 0 ; i < 100 ; i++){
+                this.arr.push(i);
+            }
+        }
     }
 </script>
diff --git a/src/components/affix/affix.vue b/src/components/affix/affix.vue
index 44ac12a9..8b9cb5e3 100644
--- a/src/components/affix/affix.vue
+++ b/src/components/affix/affix.vue
@@ -1,8 +1,9 @@
 <template>
     <div>
-        <div :class="classes" :style="styles">
+        <div ref="point" :class="classes" :style="styles">
             <slot></slot>
         </div>
+        <div v-show="slot" :style="slotStyle"></div>
     </div>
 </template>
 <script>
@@ -52,7 +53,9 @@
         data () {
             return {
                 affix: false,
-                styles: {}
+                styles: {},
+                slot: false,
+                slotStyle: {}
             };
         },
         computed: {
@@ -95,6 +98,11 @@
                 // Fixed Top
                 if ((elOffset.top - this.offsetTop) < scrollTop && this.offsetType == 'top' && !affix) {
                     this.affix = true;
+                    this.slotStyle = {
+                        width: this.$refs.point.clientWidth + 'px',
+                        height: this.$refs.point.clientHeight + 'px'
+                    }
+                    this.slot = true;
                     this.styles = {
                         top: `${this.offsetTop}px`,
                         left: `${elOffset.left}px`,
@@ -103,6 +111,8 @@
 
                     this.$emit('on-change', true);
                 } else if ((elOffset.top - this.offsetTop) > scrollTop && this.offsetType == 'top' && affix) {
+                    this.slot = false;
+                    this.slotStyle = {};
                     this.affix = false;
                     this.styles = null;