- A+
所属分类:微信小程序
在微信小程序里post请求和get情求,写法差不多,但是还是有一点点不同的,下面利用post请求做一个查询天气的微信小程序demo。
页面代码:
- <view> {{title}} </view>
- <span style="font-size:24px;"><!--index.wxml-->
- <view class="container">
- <view style="color:{{red}}">{{city_name}}</view>
- <view>{{date}}</view>
- <view>{{info}}</view>
- </view></span>
js代码:
- var app = getApp();
- var that;
- var Util = require( '../../utils/util.js' );
- Page( {
- data: {
- city_name: '',
- title:'',
- red:'green'
- },
- onLoad: function(options) {
- this.setData({
- title:options.title
- })
- that = this;
- wx.request( {
- url: "http://op.juhe.cn/onebox/weather/query",
- header: {
- //请求头和ajax写法一样
- "Content-Type": "application/x-www-form-urlencoded"
- },
- method: "POST",
- data: Util.json2Form( { cityname: "北京", key: "1430ec127e097e1113259c5e1be1ba70" }),
- complete: function( res ) {
- wx.showToast({
- title:'成功',
- icon:'success',
- duration:2000
- })
- that.setData( {
- red:'red',
- city_name: res.data.result.data.realtime.city_name,
- date: res.data.result.data.realtime.date,
- info: res.data.result.data.realtime.weather.info,
- });
- if( res == null || res.data == null ) {
- console.error( '网络请求失败' );
- return;
- }
- setTimeout(function(){
- wx.hideToast()
- },2000)
- }
- })
- }
- })
依赖util.js代码:
- function json2Form(json) {
- var str = [];
- for(var p in json){
- str.push(encodeURIComponent(p) + "=" + encodeURIComponent(json
));
- }
- return str.join("&");
- }
- module.exports = {
- formatTime: formatTime,
- json2Form:json2Form,
- }