微信小程序开发 案例二 调查问卷

这篇具有很好参考价值的文章主要介绍了微信小程序开发 案例二 调查问卷。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

第一步:主界面代码

<view >
<form bindsubmit="submit">

<view>
<text>姓名:</text>
<input name="张三" value = "张三"/>
</view>

<view>
<text>性别:</text>

<radio-group name="gender">
<label ><radio value="0" checked>男</radio></label>
<label ><radio value="1" >女</radio></label>
</radio-group>
</view>

<view>
<text>专业技能</text>
<checkbox-group name = "skills">
<label > <checkbox value="html" checked>HTML</checkbox></label>
<label > <checkbox value="css" >CSS</checkbox></label>
<label > <checkbox value="js" >JS</checkbox></label>
<label > <checkbox value="ps" >PS</checkbox></label>
</checkbox-group>
</view>
<view>
<text>您的意见</text>
<textarea name="opinion" value="测试"></textarea>
</view>
<button form-type="submit">提交</button>
</form>

</view>

微信小程序开发 案例二 调查问卷
**第二步:css样式修改

`/**index.wxss**/
.container{
  margin: 50prx;
}
view{
 margin-bottom: 30rpx;
}
input{
  width: 600rpx; 
  margin-top: 10rpx;
  border-bottom: 2rpx solid #ccc;
}
label{
  display: inline;
  margin: 8rpx;
}
textarea{
 width: 600rpx;
 height: 100rpx;
 margin-top: 10rpx;
 border: 2rpx solid #eee;
}`

第三步:安装环境
先安装node.js
node.js官网
进入官网安装稳定版本
安装完毕后在同一级创建一个空文件夹 最好都用英文文件夹名微信小程序开发 案例二 调查问卷
打开新文件夹
打开命令提示符cmd 地址找到新建的文件夹
微信小程序开发 案例二 调查问卷
输入 npm init -y
再输入 npm install express --save
用完之后不要关
会创建好如图一个文件夹 一个json文件
微信小程序开发 案例二 调查问卷
然后再这个文件夹内创建一个index.js文件 用记事本打开 输入内容

const express = require('express')
const bodyParser = require('body-parser')
const app = express()
app.use(bodyParser.json())
//处理POSE请求
app.post('/',(req,res) =>{
    console.log(req.body)
    res.json(req.body)
})
//监听3000端口
app.listen(3000,() =>{
    console.log('server running at http://127.0.0.1:3000')
})

微信小程序开发 案例二 调查问卷

打开cmd窗口
输入 nodemon index.js
出现server running at http://127.0.0.1:3000即为成功
微信小程序开发 案例二 调查问卷
然后回到微信小程序 点击提交按钮 打开cmd框回车
出现以下图示即为成功 项目完成

微信小程序开发 案例二 调查问卷文章来源地址https://www.toymoban.com/news/detail-489728.html

到了这里,关于微信小程序开发 案例二 调查问卷的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 小程序开发实战案例五 | 小程序如何嵌入H5页面

    在接入小程序过程中会遇到需要将 H5 页面集成到小程序中情况,今天我们就来聊一聊怎么把 H5 页面塞到小程序中。   本篇文章将会从下面这几个方面来介绍: 小程序承载页面的前期准备 小程序如何承载 H5 小程序和 H5 页面如何通讯 小程序和 H5 页面的相互跳转   首先介绍下

    2024年01月19日
    浏览(49)
  • 小程序开发实战案例之三 | 小程序底部导航栏如何设置

    小程序中最常见的功能就是底部导航栏了,今天就来看一下怎么设置一个好看的导航栏~这里我们使用的是支付宝官方小程序 IDE 做示范。   一般的小程序会有四个 tab,我们这次也是配置四个 tab 的导航栏。 首先,我们先创建四个页面:   tab 最多可以设置五个,参考 👉

    2024年02月05日
    浏览(63)
  • 微信小程序 | 小程序开发

    🖥️ 微信小程序专栏:小程序开发 初级知识 🧑‍💼 个人简介:一个不甘平庸的平凡人🍬 ✨ 个人主页:CoderHing的个人主页 🍀 格言: ☀️ 路漫漫其修远兮,吾将上下而求索☀️ 👉 你的一键三连是我更新的最大动力❤️ 目录 一、认识小程序开发 什么是小程序? 各个平台小

    2024年01月24日
    浏览(64)
  • 微信小程序开发 | 音乐小程序项目

    2023年04月20日
    浏览(44)
  • 微信小程序开发之微信小程序交互

    目录 一、小程序交互 前端: 1、先在登陆界面中编写代码 2、在前端中编写js代码 后端:           1、先导入依赖:           2、定义好配置文件           3、编写好实体类           4、将帮助类进行配置           5、编写mapper类           6、定义service层以及对应的

    2024年02月09日
    浏览(58)
  • 微信小程序开发---小程序的页面配置

    目录 一、小程序页面配置的作用 二、页面配置和全局配置的关系 三、页面配置中常用的配置项 在每个小程序中,每个页面都有自己的.json配置文件,用来对当前页面的窗口外观,页面效果进行配置。 小程序中,app.json中的windows节点,可以全局配置小程序中每个页面的窗口表

    2024年02月09日
    浏览(48)
  • 微信小程序开发教程(二)--上传小程序

    接上文,我们已经有一个小例子了。 在模拟器的位置,点击头像,会登录。 此时我们可以第一次尝试将我们的小程序进行上传。 点击下图箭头所指位置: 点击确定: 填写版本号和备注信息,选择上传: 在网页管理小程序上,选择上传,以下都选择红框所在位置: 填写相关

    2023年04月25日
    浏览(42)
  • 微信小程序 -- 小程序开发能力与拓展

    1. 获取用户头像 当小程序需要让用户完善个人资料时,我们可以通过微信提供的头像、昵称填写能力快速完善。如图: 想使用微信提供的头像填写能力,需要两步: 将 button 组件 open-type 的值设置为 chooseAvatar 当用户选择需要使用的头像之后,可以通过 bindchooseavatar 事件回调

    2024年04月15日
    浏览(63)
  • python做微信小程序开发,python怎么开发小程序

    大家好,小编来为大家解答以下问题,python做微信小程序开发,python怎么开发小程序,今天让我们一起来看看吧! 大家好,小编为大家解答用python编写一个小程序的问题。很多人还不知道如何用python做小软件,现在让我们一起来看看吧! 大家好,小编来为大家解答以下问题

    2024年03月12日
    浏览(66)
  • 【微信小程序开发零基础入门】——微信小程序入门

    学习小程序跟学习网页开发有什么不同 1.如何创建微信小程序项目 1.1 注册、登录、复制appId 注册:在 https://mp.weixin.qq.com/cgi-bin/wx 进行注册微信小程序开发账号 登录:在 https://mp.weixin.qq.com 登录小程序账号 复制appId: 在 \\\"开发\\\" 的 \\\"开发管理\\\" 的 \\\"开发设置\\\" 的 \\\"开发者ID\\\"中 1.2 下

    2024年02月03日
    浏览(62)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包