[小程序]微信小程序获取input并发送网络请求

1. 获取输入框数据
wxml中的input上增加bindinput属性，和方法值
在js部分定义与之对应的方法，只要在输入的时候，数据就会绑定调用到该方法，存入data属性变量中

2. 调用get请求发起网络请求
调用wx.request发起网络请求

3.调用微信Toast接口展示结果

4.按钮绑定bindtap属性，当按钮点击的时候会调用对应的方法

index.wxml部分

<view class="indexInput"><input  maxlength="100" bindinput="getEmail" placeholder="邮箱地址" />
</view>
<view class="indexInput"><input password  maxlength="30" bindinput="getPasswd" placeholder="密码" />
</view>
<view class="indexButton">
<button type="primary" bindtap="checkLogin" loading="{{loading}}"> 登录 </button>
</view>

index.js部分

//index.js
//获取应用实例
const app = getApp()Page({data: {email:"",passwd:"",},onLoad: function () {},//获取输入框数据getEmail:function(e){this.setData({email: e.detail.value})},//获取输入框数据getPasswd: function (e) {this.setData({passwd: e.detail.value})},/** 验证用户名密码是否正确*/checkLogin:function(){var email=this.data.email;var passwd = this.data.passwd;var data={loginfrom:"app",email: email,psw: passwd,output: "json"};var url = "https://api.sopans.com/third/login.php";wx.request({url: url,method: 'GET',data: data,header: {'Content-Type': 'application/json'},success(res) {if(res.data.code=200){wx.showToast({title: '成功',icon: 'success',duration: 2000})}}});}
})

转载于:https://www.cnblogs.com/taoshihan/p/11421426.html

[小程序]微信小程序获取input并发送网络请求相关推荐

全栈项目|小书架|微信小程序-登录回调及获取点赞列表功能
效果图这一节介绍,登录回调以及喜欢列表的实现. 登录回调:这里是指在获取登录完成之后,再进行下一步的操作. 比如效果图中我的页面,默认是未登录状态,积分和喜欢列表的数量都没有获取到. 而登录成 ...
微信小程序—微信小程序端支付代码
只有微信小程序端的代码,如下 Page({data: {},onLoad: function (options) {// 页面初始化 options为页面跳转所带来的参数var that = this ...
小程序 | 微信小程序实现循环嵌套数据选择
小程序 | 微信小程序实现循环嵌套数据选择一.效果展示二.代码实现在.wxml文件中,有时从后台传来的数据可能会出现数组嵌套数组的情况,需要利用wx:for嵌套实现数据的展示.这时,外层循环正常 ...
云开发版合成大西瓜小游戏微信小程序源码微信游戏小程序附带流量主功能
这是一款云开发版的合成大西瓜小游戏微信小程序源码,微信游戏小程序源码.该小游戏玩法简单,只需要拖动同样的水果落下合成新品众的水果,最终合成大西瓜,玩法酷似俄罗斯方块,相当于换一种形式的俄罗斯方块,简单 ...
小程序源码：修复图片音频全新升级带特效喝酒神器小游戏微信小程序
这是一款全新升级带特效喝酒神器小游戏微信小程序源码小编发现很多喝酒神器小程序都不带特效和音效的感觉差了那么一点意思而且感觉也不炫酷所以小编今天给大家带来一款带特效,音效炫酷的喝酒神器该款神器由 ...
微信小程序----微信小程序浏览pdf文件
微信小程序----微信小程序浏览pdf文件说明:通过wx.downloadFile,wx.openDocumen来实现打开pdf文件.只需在js操作即可. HTTP.Config.Request(' ...
微信小程序中发送网络请求
文章目录小程序项目 app.json pages/index/index.html pages/index/index.wxss pages/index/index.js 发送网络请求网络请求函数 ...
小程序源码：炫酷手持滚动弹幕生成小工具微信小程序-多玩法安装简单
这是一款滚动弹幕生成微信小程序源码让弹幕文字在手机屏幕上跑起来,LED弹幕手机弹幕,告白神奇,等支持多种模板,每一种模板都支持自定义颜色等等字体跳动,字体表白等等另外用户也可以支持自定义文字 ...
小程序 | 微信小程序实现商品分类列表
小程序 | 微信小程序实现商品分类列表一.效果展示二.代码实现  <view class="container"> <! ...

[小程序]微信小程序获取input并发送网络请求

[小程序]微信小程序获取input并发送网络请求相关推荐

最新文章

热门文章