vue手机版，微信小程序，安卓，IOS 开发的比较(4)--事件响应

vue：
1、 直接在标签中写js方法

 <button v-on:click="alert（'hi'）">执行方法的第一种写法</button>

2、调用method的办法

 <button v-on:click="run()">执行方法的第一种写法</button>
 
  <button @click="run()">执行方法的 简写 写法</button>

export default {     
      data () { 
        return {
          msg: '你好vue',
          list:[]      
        }
      },
      methods:{
           run:function(){
              alert('这是一个方法');
             }
           }
 }

（1）方法传参，方法直接在调用时在方法内传入参数

     <button @click="deleteData('111')">执行方法传值111</button>
     
     <button @click="deleteData('222')">执行方法传值2222</button>

     deleteData(val){
                alert(val);
            },

（2）传入事件对象

<button data-aid='123' @click="eventFn($event)">事件对象</button>

eventFn(e){
          console.log(e);
          // e.srcElement  dom节点
          e.srcElement.style.background='red';
          console.log(e.srcElement.dataset.aid);  /*获取自定义属性的值*/
        }

小程序
xxx.wxml

<text class='textStyle'>文本操作</text>
 
<button class='buttonStyle' bindtap='buttonClick'>{{buttonTitle}}</button>
 
<view class='viewStyle'>块操作</view>

xxx.wxjs

Page({
 
  /**
   * 页面的初始数据
   */
  data: {
    buttonSelected:false,
    buttonTitle: "按钮操作",
  },
 
  buttonClick: function(even) {    
    this.setData({
      buttonSelected: !this.data.buttonSelected,
      buttonTitle: (this.data.buttonSelected ? "按钮操作-选中" : "按钮操作")
    })
  }
}

安卓 变量绑定控件，注解将控件事件和函数联系在一起
xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:background="@drawable/bg_logo"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true" >

        <include
            android:id="@+id/login_ll_layout"
            android:layout_width="match_parent"
            android:layout_height="130dip"
            layout="@layout/input_layout" />

        <include
            android:id="@+id/layout_progress"
            android:layout_width="match_parent"
            android:layout_height="130dip"
            layout="@layout/layout_progress"
            android:visibility="gone" />

        <Button
            android:id="@+id/btn_login_ok"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/login_ll_layout"
            android:layout_centerInParent="true"
            android:layout_marginTop="15dip"
            android:background="@drawable/text_bg"
            android:gravity="center"
            android:paddingBottom="5dp"
            android:paddingLeft="20dp"
            android:paddingRight="20dp"
            android:paddingTop="5dip"
            android:text="登  录"
            android:textColor="#ffffff"
            android:textSize="20sp" />
    </RelativeLayout>
    </LinearLayout>

public class UserLoginActivity extends BaseActivity {
    @BindView(R.id.user_id)
    EditText userId;
    @BindView(R.id.password)
    EditText password;
    @BindView(R.id.btn_login_ok)
    Button btnLoginOk;
    @OnClick(R.id.btn_login_ok)
    public void onViewClicked() {
     UserId = userId.getText().toString().trim();
     passWord = password.getText().toString().trim();
     。。。。。。。。。。。。。。。。。。。。。。。。。。。。
  }

IOS
.h
xib文件包括绑定信息
变量绑定控件，函数绑定事件

@interface DJLoginVC : UIViewController

@end

.m

@interface DJLoginVC ()
@property (weak, nonatomic) IBOutlet UITextField *useNameTF;
@property (weak, nonatomic) IBOutlet UITextField *passTF;
- (IBAction)loginBtn:(id)sender {
        NSDictionary *dict = @{
                               @"city" : self.dbName,
                               @"uid"  : self.useNameTF.text,
                               @"pwd"  : self.passTF.text,
                               @"bid"  : self.uuidStr
                               };
}