ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

微信小程序-贪吃蛇开发12 Modal标签

2022-01-22 14:32:15  阅读:213  来源: 互联网

标签:12 微信 贪吃蛇 标签 Modal 按钮 hidden 弹窗


本系列是作者自学实践过程的记录
本文是关于贪吃蛇的弹窗控制
有问题欢迎讨论

一、Model标签介绍

通过Modal标签,可以实现弹窗功能,例如当游戏结束时应该让用户执行什么样的操作。

属性作用
hidden弹窗是否隐藏
no-cancel取消按钮是否显示
confirm-text确定按钮文字展示
cancel-text取消按钮文字展示
bindfirm点击确认按钮后触发的回调
bindcancel点击取消按钮后触发的回调

二、Modal标签使用

贪吃蛇游戏中,不需要取消按钮,点击确认按钮后完成重置即可。

  <modal class = "modal" hidden="{{modal_hidden}}" no-cancel
  bindconfirm = "modelConfirm">
    <view>游戏结束,需要重新开始吗?</view>
  </modal>

对应的js函数

  // 弹出窗口控制,点击确认后执行的函数
  modalConfirm:function(){
    this.setData({
      // 恢复初始化
      score:0,
      ground:[],
      snake:[],
      food:[],
      modal_hidden:true,
      direction:""
    })
    this.onLoad()
  }

三、完结

到这里,贪吃蛇就完成了开发过程,代码已经上传到博客了,欢迎大家下载学习。

标签:12,微信,贪吃蛇,标签,Modal,按钮,hidden,弹窗
来源: https://blog.csdn.net/qq_44027696/article/details/122636833

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有