微信小程序 3__事件,方法传参,数据绑定,微信API调用

一 事件和方法传参

这里bindtap 表示绑定的点击事件, 事件名称为clickMe,  data- 开头表示传递参数, val1表示参数名称,也可以是val2 或者其他名字, 1表示参数的值。

我们要明白一条: 微信小程序开发 跟 vue 开发差别是很大的。  如果同时在面对两个任务, 不可搞混淆了。

二  数据绑定

用{{}} 表示, 该语法称为插值表达式。

event.wxml




{{msg}}




对应的js文件 event.js

// pages/event/event.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    msg: "Hello World"
  },
  clickMe:function(value){
    this.setData({
      msg: "你好,世界"
    })
    console.log(this.data.msg);
    console.log( value.currentTarget.dataset);
  },
  changeMe(){
    console.log("文本框变化了");
  },
  getUserInfo(e){
    console.log("获取用户信息 ");
    console.log(e);
  },
  getphoneNumber(e){
    console.log("获取用户手机号 ");
    console.log(e);
  },
getcontact(e){
  console.log(e);
},

})

讲解一下 MVVM:   M: Model,  V:View,   VM:ViewModel 

示例运行效果图

微信小程序 3__事件,方法传参,数据绑定,微信API调用_第1张图片

示例代码参考  miniprogram_20210310  工程

你可能感兴趣的:(小程序基础)