09-微信小程序API网络请求(实现轮播广告和简易的聊天窗口)

微信小程序网络api的使用
微信小程序图片api的使用
微信小程序相机api的使用
微信小程序授权登录
实现小鱼租房首页
WePY介绍
插件演示

<swiper indicator-dots="true" autoplay="true" interval="3000" duration="500">
  <swiper-item wx:for="{{images}}">
    <image src="{{item.original}}" width="375" height="150" />
  </swiper-item>
</swiper>

  /**
   * 页面的初始数据
   * 默认设置 images 空的数组
   */ 
data: {
    images:[] 
    },

  //加载广告数据
  loadDate() {
        },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad:function(options) {
    console.log("页面加载完成",options);
    this.loadDate();
  },

//demo/index.js
Page({
  data: {
    images: []
  },
  loadData() {
    const _this = this;
    wx.showLoading({
      title: '加载中',
    });
    wx.request({
      url: 'http://127.0.0.1:18080/ad?type=1',
      success(res) {
        _this.setData({
          images: res.data.data.list
        });
        wx.hideLoading();
      }
    })
  },
  onLoad(options) {
    this.loadData();
  }
})

{
  "pages":[
    "pages/index/index",
    "pages/logs/logs",
    "pages/demo/index",
    "pages/im/im"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#80ff80",
    "navigationBarTitleText": "我的第一个微信小程序",
    "navigationBarTextStyle":"black"
  },
  "tabBar": {
    "list": [
      {
        "pagePath": "pages/index/index",
        "text":"首页"
      },
      {
        "pagePath": "pages/logs/logs",
        "text":"日志"
      },
      {
        "pagePath": "pages/demo/index",
        "text":"Demo"
      },
      {
        "pagePath": "pages/im/im",
        "text":"IM"
      }
    ]
  },
  "style": "v2",
  "sitemapLocation": "sitemap.json"
}

<input name="url" value="ws://127.0.0.1:18081/ws/1001" bindinput="urlInput" />
<button size='mini' type="warn">断开连接</button>
<button size='mini' type="primary" bindtap="connectSocket">开启连接</button>
<textarea placeholder="输入发送内容" bindinput="msgInput"></textarea>
<button size='mini' type="primary" bindtap="sendMsg">发送</button>
<view wx:for="{{msgs}}">{{index}}: {{item}}</view>

/* pages/im/im.wxss */

input,textarea{
  border: 1px black solid;
}

button,input,textarea,view{
  margin: 10px;
}

// pages/im/index.js
Page({
  /**
  * 页面的初始数据
  */
  data: {
    url: 'ws://127.0.0.1:18081/ws/1001',
    msgs: [],
    msg: ''
  },
  connectSocket() {
    let _this = this;
    let task = wx.connectSocket({
      url: _this.data.url
    });
    task.onMessage(function (res) {
      let data = JSON.parse(res.data);
      let msg = data.from.id + ", " + data.msg;
      _this.setData({
        msgs: [..._this.data.msgs, "接收到消息 -> " + msg]
      });
    });
    _this.setData({
      socketTask: task,
      msgs: [..._this.data.msgs, "连接成功!"]
    });
  },
  urlInput(e) {
    this.setData({
      url: e.detail.value
    });
  },
  msgInput(e) {
    this.setData({
      msg: e.detail.value
    });
  },
  sendMsg() {
    let msg = this.data.msg;
    this.data.socketTask.send({
      data: msg
    });
    this.setData({
      msgs: [...this.data.msgs, "发送消息 -> " + msg]
    });
  }
})