微信小程序 弹窗自定义的代码

这篇文章主要介绍了微信小程序 弹窗自定义实例代码的相关资料,有时候做开发项目的时候需要根据客户需求更改原系统的组件，这里就对小程序中弹窗进行更改，需要的朋友可以参考下

微信小程序 弹窗

首先wxml代码：

 view >
注：hidden属性用于切换比较频繁的地方。
wxss代码设置弹窗样式:
.myToast{
 width:240rpx;
 height:130rpx;
 line-height: 130rpx;
 margin:80rpx 35%;
 border-radius:20rpx;
 background-color: rgb(114,113,113);
 color:rgb(255,255,255);
 font-size: 36rpx;
 text-align: center;
 position: absolute;
 z-index: 100;
 opacity: 0.85;
}
js:
Page({
 data:{
 nullHouse:true, //先设置隐藏
 onLoad:function(options){
 // 页面初始化 options为页面跳转所带来的参数
 onReady:function(){
 // 页面渲染完成
 onShow:function(){
 // 页面显示
 onHide:function(){
 // 页面隐藏
 onUnload:function(){
 // 页面关闭
 clickArea:function(){
 var that = this;
 this.setData({
 nullHouse:false, //弹窗显示
 setTimeout(function(){
 that.data.nullHouse = true, //1秒之后弹窗隐藏
 },1000)
})
 注：setTimeout()函数是异步的，当计算机执行到setTimeout时，此任务先暂停并保存，继续执行后续未完成的任务，当条件满足时，再将setTimeout的执行任务放回任务队列的后面，等待执行。
以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！
相关推荐：
微信小程序的消息提示框的实现

微信小程序实现动态设置placeholder提示文字及按钮选中/取消状态的方法


以上就是微信小程序 弹窗自定义的代码的详细内容，更多请关注php中文网其它相关文章！
 
  
 微信app下载
 
微信是一款手机通信软件，支持通过手机网络发送语音短信、视频、图片和文字。微信可以单聊及群聊，还能根据地理位置找到附近的人，带给大家全新的移动沟通体验，有需要的小伙伴快来保存下载体验吧！