Doc
download
npm i weex-lui -S
weex-page
Weex 页面组件,能够像原生应用一样切换页面,且有平移动画
Usage
<template>
<div>
<div @click="showPage"
class="show-btn"
>
<text>showpage</text>
</div>
<weex-page
ref="page"
position="right"
background-color="#EEEEEE"
:duration="300"
timing-fun="ease-in"
>
<div @click="hidePage"
class="hide-btn"
>
<text>hi</text>
</div>
</weex-page>
</div>
</template>
<script>
import { WeexPage } from 'weex-lui'
export default {
components: { WeexPage },
methods: {
showPage () {
this.$refs.page.showPage()
},
hidePage () {
this.$refs.page.hidePage()
}
}
}
</script>
props
Prop | Type | Required | Default | Description |
---|---|---|---|---|
position |
String |
N |
right |
页面从哪个方向进入 |
background-color |
String |
N |
white |
颜色值:white /#FF000 /rgb(0, 0, 0)
|
duration |
Number |
N |
300 |
单位为 ms
|
timing-fun |
String |
N |
ease |
过渡动画: ease,ease-in等 |