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

3.3.12开发创建投票多选投票页面

创建投票多选投票页面和创建单选投票页面没有区别,唯一区别仅在于向服务端发送数据时,告诉服务器这个投票是什么类型的投票。这个类型用三种数据类型表示都可以,分别如下所示:

multiple:true/false //boolean类型

type:1/0 //number类型

type:'multiVote'/'radioVote' //string类型

我选string类型,主要时一看就懂。

因为想做微信小程序兼职看能不能赚钱,就不一个个敲代码实现多选投票页面了。

首先在app.js里增加多选投票页面:

"pages":[

"pages/index/index",

"pages/createVote/createVote",

"pages/createMultiVote/createMultiVote"

],

保存后,createMultiVote文件夹下四个文件全部复制createVote文件夹下文件。

修改createMultiVote.json文件,将这个页面的标题设置为“创建多选投票”。代码如下:

{

"navigationBarTitleText": "创建多选投票"

}

在pages/index/index.js文件中增加一个onTapCreateMultiVote函数,作为首页“创建多选投票”按钮的事件处理函数,代码如下:

onTapCreateMultiVote(){

wx.navigateTo({

url: '/pages/createMultiVote/createMultiVote',

})

}

pages/index/index.wxml绑定onTapCreateMultiVote函数,代码如下:

多选投票

创建一个多选投票

在createVote.js中formSubmit函数添加单选类型:

formSubmit(){

const formData = {

type:'radioVote',

...

}

}

在createMultiVote.js中formSubmit函数添加多选类型:

formSubmit(){

const formData = {

type:'multiVote',

...

}

}

预览效果如下:《微信小程序开发从入门到实战》学习二十四_第1张图片

你可能感兴趣的:(微信小程序,学习,小程序)