标签：提醒 function flex 通知 padding notificationShow text 定时 margin
【现象描述】
当用户使用快应用时，定时给用户发送提醒，省去了去桌面找该快应用的图标或者去快应用中心寻找该应用的过程。
在onHide中添加定时器，当用户离开应用时定时发送通知消息提醒用户，正常点击应用进入可以在onShow关闭定时器，而从通知消息跳转进入则不会关闭。
【问题分析】
点击进入应用时，会触发生命周期onShow方法中关闭定时器的方法，但是从通知消息进入应用不会触发onShow。
【解决方法】
声明当前页面的启动模式，标识为"singleTask"模式，每次打开目标页面都会回调onRefresh生命周期函数，关闭定时器。
Manifest.json
"router": {
"entry": "Hello",
"pages": {
"Hello": {
"launchMode": "singleTask",
"component": "hello"
}
}
},
Hello.ux
onHide: function () {
this.notificationShow = setInterval(() => {
this.show()
}, 1000)
},
onShow: function () {
clearInterval(this.notificationShow);
},
onRefresh() {
clearInterval(this.notificationShow);
},
代码如下：
<template>
<div class="container">
<div class="item-container">
<div class="item-content">
<div class="item-content-detail">
<text class="txt">Title:</text>
<input class="input" placeholder="Please input title" onchange="titleFn" />
</div>
<div class="item-content-detail">
<text class="txt">Content:</text>
<input class="input" placeholder="Please input content" onchange="contentFn" />
</div>
</div>
<input type="button" class="btn" value="Send a notification" onclick="show" />
</div>
</div>
</template>
<style>
.container {
flex: 1;
flex-direction: column;
}
.item-container {
margin-top: 50px;
margin-right: 60px;
margin-left: 60px;
flex-direction: column;
}
.item-content {
flex-direction: column;
background-color: #ffffff;
padding-left: 30px;
padding-right: 30px;
padding-top: 15px;
padding-bottom: 15px;
margin-bottom: 100px;
}
.item-content-detail {
align-items: center;
}
.input {
flex: 1;
font-size: 30px;
padding-left: 20px;
}
.txt {
width: 150px;
padding-top: 15px;
padding-bottom: 15px;
text-align: right;
}
.btn {
height: 80px;
text-align: center;
border-radius: 5px;
margin-right: 60px;
margin-left: 60px;
margin-bottom: 50px;
color: #ffffff;
font-size: 30px;
background-color: #0faeff;
}
</style>
<script>
import prompt from '@system.prompt'
import notification from '@system.notification'
export default {
data: {
componentData: {},
inputTitle: 'title',
inputContent: 'content',
num: '',
},
onInit: function () {
this.$page.setTitleBar({ text: 'notification' })
},
onHide: function () {
this.notificationShow = setInterval(() => {
this.show()
}, 1000)
},
onShow: function () {
clearInterval(this.notificationShow);
},
onRefresh() {
clearInterval(this.notificationShow);
},
show: function () {
var that = this
that.num++;
prompt.showToast({
message: '标题为: ' + that.inputTitle + ' "的消息已发送，请查看消息通知栏 ' + ',No:' + that.num,
})
notification.show({
contentTitle: that.inputTitle,
contentText: that.inputContent + ',No:' + that.num,
clickAction: {
uri: '/Hello'
},
})
},
titleFn: function (e) {
this.inputTitle = e.text
},
contentFn: function (e) {
this.inputContent = e.text
},
}
</script>
欲了解更多更全技术文章，欢迎访问https://developer.huawei.com/consumer/cn/forum/?ha_source=zzh
标签：提醒,function,flex,通知,padding,notificationShow,text,定时,margin 来源： https://www.cnblogs.com/developer-huawei/p/16590702.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。