From a1de44c97a9eae04e0c81ea74d4e331523ebdc2b Mon Sep 17 00:00:00 2001
From: chenjiahan <chenjiahan@youzan.com>
Date: Wed, 9 Dec 2020 10:16:36 +0800
Subject: [PATCH] docs(Sticky): use composition api

---
 src/sticky/README.md       | 10 +++-------
 src/sticky/README.zh-CN.md | 10 +++-------
 src/sticky/demo/index.vue  | 21 +++++++++------------
 3 files changed, 15 insertions(+), 26 deletions(-)

diff --git a/src/sticky/README.md b/src/sticky/README.md
index 8a5d11cf4..268e1f375 100644
--- a/src/sticky/README.md
+++ b/src/sticky/README.md
@@ -40,13 +40,9 @@ app.use(Sticky);
 
 ```js
 export default {
-  data() {
-    return {
-      container: null,
-    };
-  },
-  mounted() {
-    this.container = this.$refs.container;
+  setup() {
+    const container = ref(null);
+    return { container };
   },
 };
 ```
diff --git a/src/sticky/README.zh-CN.md b/src/sticky/README.zh-CN.md
index c75734da0..9678abe16 100644
--- a/src/sticky/README.zh-CN.md
+++ b/src/sticky/README.zh-CN.md
@@ -50,13 +50,9 @@ app.use(Sticky);
 
 ```js
 export default {
-  data() {
-    return {
-      container: null,
-    };
-  },
-  mounted() {
-    this.container = this.$refs.container;
+  setup() {
+    const container = ref(null);
+    return { container };
   },
 };
 ```
diff --git a/src/sticky/demo/index.vue b/src/sticky/demo/index.vue
index ba7bc0dd9..9b7c424ef 100644
--- a/src/sticky/demo/index.vue
+++ b/src/sticky/demo/index.vue
@@ -1,7 +1,7 @@
 <template>
   <demo-block :title="t('basicUsage')">
     <van-sticky>
-      <van-button type="primary" style="margin-left: 15px;">
+      <van-button type="primary" style="margin-left: 15px">
         {{ t('basicUsage') }}
       </van-button>
     </van-sticky>
@@ -9,16 +9,16 @@
 
   <demo-block :title="t('offsetTop')">
     <van-sticky :offset-top="50">
-      <van-button type="primary" style="margin-left: 115px;">
+      <van-button type="primary" style="margin-left: 115px">
         {{ t('offsetTop') }}
       </van-button>
     </van-sticky>
   </demo-block>
 
   <demo-block v-if="!isWeapp" :title="t('setContainer')">
-    <div ref="container" style="height: 150px; background-color: #fff;">
+    <div ref="container" style="height: 150px; background-color: #fff">
       <van-sticky :container="container">
-        <van-button type="warning" style="margin-left: 215px;">
+        <van-button type="warning" style="margin-left: 215px">
           {{ t('setContainer') }}
         </van-button>
       </van-sticky>
@@ -27,6 +27,8 @@
 </template>
 
 <script>
+import { ref } from 'vue';
+
 export default {
   i18n: {
     'zh-CN': {
@@ -39,14 +41,9 @@ export default {
     },
   },
 
-  data() {
-    return {
-      container: null,
-    };
-  },
-
-  mounted() {
-    this.container = this.$refs.container;
+  setup() {
+    const container = ref(null);
+    return { container };
   },
 };
 </script>