weex-lui
v0.1.2
Published
Lightweight components of weex
Downloads
5
Maintainers
Readme
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等 |