微信小程序数据传递基本

1.从后台服务器获取数据,然后存在JS,通过数据绑定显示在页面

后台获取数据:

getUser: function () {
  var that = this;  //function 里面已经不是this所以使用this.setData不起作用 wx.request({ url:
'User/findUserById', data: { id: 1 }, header: { 'Content-Type': 'application/x-www-form-urlencoded' }, success: function (data) { that.setData({ user: data }); } }) }

wxml页面:

<view>
用户名:{{user.name}}
用户密码:{{user.password}}
</view>

2.页面输入的数据,存到JS然后发送给后台服务器

 wxml:

<view>
姓名:<input placeholder="输入姓名" type='text' value='{{name}}' bindinput="bindName"></input>
密码:<input placeholder="输入密码" type='password' value='{{password}}' bindinput="bindPassWord"></input>
</view>
<button bindtap='saveUser'>添加用户</button>

JS:

bindName: function(e){
    this.setData({
      name: e.detail.value
    });
  }
bindPassWord: function(e){
    this.setData({
      password: e.detail.value
    });
  }
saveUser: function () {
    wx.request({
      url: 'User/addUser',
      data: {
        name: this.name,
        password: this.password     
      },
      header: {
        'Content-Type': 'application/x-www-form-urlencoded'
      },
      success: function (data) {
       //服务器返回信息
      }
    })
  }

3.页面到页面

wxml:

<view data-id="{{user.id}}" bindtap="goUserDetail"></view>

JS:

/**
   * 跳转到用户详情
   */
  goUserDetail: function (e) {
    wx.navigateTo({
      url: '../User/Detail?id=' + e.currentTarget.dataset.id
    })
  }

在另外一个页面用户详情JS获取id:

/**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.setData({
      id: options.id
    });
  }
原文地址:https://www.cnblogs.com/i-tao/p/8799031.html