blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

docs(Sticky): use composition api

Browse Source
This commit is contained in:
chenjiahan 2020-12-09 10:16:36 +08:00
parent d297807f55
commit a1de44c97a
3 changed files with 15 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/sticky/README.md
View File

@ -40,13 +40,9 @@ app.use(Sticky);
```js ```js
export default { export default {
data() { setup() {
return { const container = ref(null);
container: null, return { container };
};
},
mounted() {
this.container = this.$refs.container;
}, },
}; };
``` ```

10
src/sticky/README.zh-CN.md
View File

@ -50,13 +50,9 @@ app.use(Sticky);
```js ```js
export default { export default {
data() { setup() {
return { const container = ref(null);
container: null, return { container };
};
},
mounted() {
this.container = this.$refs.container;
}, },
}; };
``` ```

21
src/sticky/demo/index.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<demo-block :title="t('basicUsage')"> <demo-block :title="t('basicUsage')">
<van-sticky> <van-sticky>
<van-button type="primary" style="margin-left: 15px;"> <van-button type="primary" style="margin-left: 15px">
{{ t('basicUsage') }} {{ t('basicUsage') }}
</van-button> </van-button>
</van-sticky> </van-sticky>
@ -9,16 +9,16 @@
<demo-block :title="t('offsetTop')"> <demo-block :title="t('offsetTop')">
<van-sticky :offset-top="50"> <van-sticky :offset-top="50">
<van-button type="primary" style="margin-left: 115px;"> <van-button type="primary" style="margin-left: 115px">
{{ t('offsetTop') }} {{ t('offsetTop') }}
</van-button> </van-button>
</van-sticky> </van-sticky>
</demo-block> </demo-block>
<demo-block v-if="!isWeapp" :title="t('setContainer')"> <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-sticky :container="container">
<van-button type="warning" style="margin-left: 215px;"> <van-button type="warning" style="margin-left: 215px">
{{ t('setContainer') }} {{ t('setContainer') }}
</van-button> </van-button>
</van-sticky> </van-sticky>
@ -27,6 +27,8 @@
</template> </template>
<script> <script>
import { ref } from 'vue';
export default { export default {
i18n: { i18n: {
'zh-CN': { 'zh-CN': {
@ -39,14 +41,9 @@ export default {
}, },
}, },
data() { setup() {
return { const container = ref(null);
container: null, return { container };
};
},
mounted() {
this.container = this.$refs.container;
}, },
}; };
</script> </script>