微信小程序输入框数据获取（九）

原创

已于 2022-05-09 13:45:33 修改 · 4.9k 阅读

38 ·

CC 4.0 BY-SA版权

文章标签：

#微信小程序 #小程序

于 2021-10-23 17:34:06 首次发布

我们以用户登录例子来写输入框数据的获取。首先，我们做一个登录界面，界面里有用户名输入框，我们要求在第二个界面获得用户名，显示为欢迎XXX登录！

<view class="title">
  <text>登录界面</text>
</view>
<view class="body">
  <text>请输入用户名：</text>
  <input type="text" name="username" bindinput="getUsername" />   //***bindinput="getUsername"
</view>
<view class="body">
  <text>请输入密码：</text>
  <input style="border: 1px;" type="text" name="password" />
</view>
<view>
  <button bindtap="gotoindex2">登陆</button>
</view>

之后在js文件中定义函数


const app=getApp();   //定义常量

Page({

  /**
   * 页面的初始数据
   */
  data: {
    username:""
  },


//当前界面拿到页面输入的值
  getUsername:function(username){   
    this.setData({
      username:username.detail.value
    })
  },

//页面跳转并传值（就是定义一个常量并将获得的值放进常量里，其他地方就可以直接拿来使用）
  gotoindex2:function(){        
    app.username=this.data.username;
    wx.navigateTo({        //页