《微信小程序开发从入门到实战》学习二十七

3.4 开发参与投票页面

3.4.2 借用伪造数据开发功能

为了便于开发,新建一个编译模式:

之前没看文章,每次都习惯性填完投票创建的信息提交再跳转看效果。好累。 添加变异模式开发真方便。

另外,点击提交后没跳转到投票页面,通过uni-app路由跳转(redirectTo、navigateTo)不生效_uni.redirectto不生效_小玲子小玲子的博客-CSDN博客

发现自己的redirectTo方法中的url属性值前面没加上/,现在已经改了《微信小程序开发从入门到实战》二十六,书中代码没问题,自己粗心大意没控制住,哎。

接下来修改pages/vote/vote.js文件的代码:

// pages/vote/vote.js

Page({

  /**

   * 页面的初始数据

   */

  data: {

    voteID:'',

    type:'',

    voteTitle: '',

    voteDesc: '',

    optionList: [],

    endDate: '', //用于保存截止日期

    isAnonymous: false,

    isExpired: false, 

    pickedOption:[] //当前用户选择的选项

  },

  /**

   * 生命周期函数--监听页面加载

   */

  onLoad(options) {

    const voteID = options.voteID //通过页面路径参数获取投票ID

    this.getVoteDateFromServer(voteID) //从服务器端获取投票信息

  },

  checkExpired(endDate){

    const now = new Date()

    const nowYear = now.getFullYear() 

    const nowMonth = now.getMonth() + 1 

    const nowDay = now.getDate()

    const endDateArray = endDate.split('-') //将字符串分隔成字符数组,分隔符为-

    const endYear = Number(endDateArray[0]) //取字符数组中的年份,并将数据类型转换为number

    const endMonth = Number(endDateArray[1]) //取字符数组中的月份,并将数据类型转换为number

    const endDay = Number(endDateArray[2]) //取字符数组中的日期,并将数据类型转换为number

    //判断是不是年份超了

    if(nowYear > endYear){

      return true

    }

    //判断是不是月份超了

    if((nowYear === endYear) && (nowMonth > endMonth)){

      return true

    }

    //判断是不是日期超了

    if((nowYear === endYear) && (nowMonth === endMonth) && (nowDay === endDay)){

      return true

    }

    //其他情况一定超了 

    return false

  },

  getVoteDateFromServer(voteID) {

    if(voteID === 'test'){ //如果投票ID为test,则伪造一些测试数据

      const voteData = {

        type:'radioVote',

        voteTitle: '测试数据投票标题',

        voteDesc: '测试数据投票描述',

        optionList: ['测试数据选项1','测试数据选项2','测试数据选项3','测试数据选项4'],

        endDate: '2023-12-30', //用于保存截止日期

        isAnonymous: false

      }

      /* 以上是伪造的测试数据*/

      const isExpired = this.checkExpired(voteData.endDate) //检查投票是否已经过期

      this.setData({

        voteID,

        type: voteData.type,

        voteTitle: voteData.voteTitle,

        voteDesc: voteData.voteDesc,

        optionList: voteData.optionList,

        endDate: voteData.endDate,

        isAnonymous: voteData.isAnonymous,

        isExpired

      })

    }else{

      // TODO 真的从服务端获取投票信息

    }

  },

})

借用的伪造的测试数据完成了数据的加载。现在将这些逻辑层的数据在视图层进行展示了。

3.4.2 借用伪造数据开发功能完成。

3.4.3 使用radio单项选择器组件敬请期待。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/212722.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

<JavaEE> 什么是线程(Thread)?进程和线程有什么区别?

目录 一、线程(Thread)的概念 二、线程存在的意义 2.1 并发编程 2.2 比进程更“轻量” 三、使用线程时应该注意 四、进程和线程的区别 五、Java中的线程和操作系统中的线程是不同的概念 六、多线程编程 一、线程(Thread)的…

Linux进程通信——信号(一)

原理 对于 Linux来说,实际信号是软中断,许多重要的程序都需要处理信号。 信号,为 Linux 提供了一种处理异步事件的方法。比如,终端用户输入了ctrlc来中断程序,会通过信号机制停止一个程序。 概述 信号的名字和编号 …

nodejs 如何将 Buffer 数据转为 String

问题说明 使用webSocket的时候出现了一个问题,前端小程序和nodejs后端建立websocket连接后,使用send方法发送到后端为buffer格式,以下为我前后端代码 1、前端小程序代码 //创建webSocket连接 const socket uni.connectSocket({url: wss…

畅捷通T6 客户端登录提示 运行时错误 372 加载控件cfloatmenu失败

客户单win10电脑, T6版本是 V7.1 不知道操作了什么每个电脑提示 运行时错误372: 从加载控件CFloatMenu失败。您的版本可能已过期。确认您使用的控件版本是同您的应用程序一起提供的。 ******* 解决办法: 找个其他电脑复制mscomctl.ocx 到操作系统目录里面注册一下,即可. …

linux网络之网络层与数据链路层

文章目录 一、网络层 1.IP协议 2.IP协议头格式 3.网段划分 4.特殊ip地址 5.IP地址的数量限制 6.私有ip和公网IP 7.路由 二、数据链路层 1.以太网 2.以太网帧格式 3.MAC地址 4.对比理解MAC地址和IP地址 5.MTU 6.ARP协议 ARP协议的工作流程 ARP数据报的格式 7.DNS 8.ICMP协议 9.N…

【Python】

Python 一、入门语法1.1 字符串的多种定义方式1.2 Python中的运算符1.3 input语句1.4 字符串格式化的方式 二、Python判断语句2.1 布尔类型和比较运算符2.2 if判断语句的基础格式2.3 if else语句的使用2.4 if_elif_else语句的使用2.5 判断语句的嵌套 三、Python循环语句3.1 whi…

操作系统(七)| 设备管理-- 端口 驱动程序 基本I/O控制 磁盘I/O

文章目录 1 设备管理概述1.1 系统总线结构1.2 设备控制器通用结构1.3 I/O设备的模型 2 I/O端口2.1 寻址方式 3 驱动程序4 基本I/O控制方式4.1 程序直接控制4.2 中断I/O方式4.3 DMA方式4.4 I/O通道控制方式 5 I/O管理中的重要思想5.1 设备独立性5.2 SPOOLing技术5.3 I/O软件的多…

C++类与对象(4)—日期类的实现

目录 一、类的创建和方法声明 二 、输出&运算符重载 三、检查合法性 1、获取对应年月的天数 2、初始化 四、实现加等和加操作 1、先写再写 2、先写再写 3、两种方式对比 五、实现自增和--自减 1、自增 2、自减 六、 实现减等和减操作 1、减等天数 2、加负数…

【开源】基于Vue.js的数据可视化的智慧河南大屏

项目编号: S 059 ,文末获取源码。 \color{red}{项目编号:S059,文末获取源码。} 项目编号:S059,文末获取源码。 目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块三、系统展示四、核心代码4.1 数据模块 …

Dubbo3使用Zookeeper作为注册中心的方案讨论!详解DubboAdmin与PrettyZoo来监控服务的优劣!

文章目录 一:Dubbo注册中心的基本使用 二:Zookeeper注册中心的使用 1:依赖引入 2:实际开发 三:Zookeeper作为注册中心的使用展示 1:启动注册Zookeeper服务 2:引入注册中心 (一)&#xf…

CTF-PWN-QEMU-前置知识

文章目录 QEMU 内存管理(QEMU 如何管理某个特定 VM 的内存)MemoryRegion gpa->hpaFlatView:表示MR 树对应的地址空间FlatRange:存储不同MR对应的地址信息AddressSpace:不同类型的 MemoryRegion树RAMBlock总体简化图 QEMU 设备模拟 &#x…

Redis-Redis高可用集群之水平扩展

Redis3.0以后的版本虽然有了集群功能,提供了比之前版本的哨兵模式更高的性能与可用性,但是集群的水平扩展却比较麻烦,今天就来带大家看看redis高可用集群如何做水平扩展,原始集群(见下图)由6个节点组成,6个节点分布在三…