陈誉午
994b267f5c
- 电子药箱: 药品库存管理 + 手动录入 + 今日用药打卡 - 药品百科: 搜索 + 分类筛选 + 20种药品静态数据 - 惠教中心: 4条药品使用指南课程 - 我的: 家庭成员信息管理 - 自定义TabBar + navigation-bar组件 - SVG药品分类插图
48 lines
1.1 KiB
TypeScript
48 lines
1.1 KiB
TypeScript
// @ts-nocheck
|
|
const systemInfo = wx.getWindowInfo();
|
|
|
|
Component({
|
|
properties: {
|
|
visible: {
|
|
type: Boolean,
|
|
value: false,
|
|
observer(newVal:any) {
|
|
if (newVal) {
|
|
//先挂载再执行动画
|
|
this.setData({ showSelf: true }, () => {
|
|
setTimeout(() => {
|
|
this.setData({
|
|
popupAnimate: 'show',
|
|
maskAnimate: 'show'
|
|
})
|
|
}, 20)
|
|
})
|
|
} else {
|
|
//先执行动画，不见了再卸载
|
|
this.setData({
|
|
popupAnimate: 'hide',
|
|
maskAnimate: 'hide'
|
|
})
|
|
// 等动画结束再卸载
|
|
setTimeout(() => {
|
|
this.setData({ showSelf: false })
|
|
}, 500) //和transition一致
|
|
}
|
|
}
|
|
}
|
|
},
|
|
data: {
|
|
showSelf: false,
|
|
safeBottom: systemInfo.safeArea.bottom - systemInfo.safeArea.height, //底部的安全距离，避免被返回键挡住了
|
|
popupAnimate: '',
|
|
maskAnimate: ''
|
|
},
|
|
methods: {
|
|
handleClose() {
|
|
this.triggerEvent('close');
|
|
},
|
|
emptyEvent() {
|
|
}
|
|
}
|
|
})
|