微信小程序 for，if语法 事件对象，事件传参

目录

01 数据的定义和使用

02 for渲染

03 条件渲染

04 小程序中的事件

05 事件对象event 及传参

06 动态绑定

---

01 数据的定义和使用

        小程序里面也有小胡子语法{{}}，定义数据需要在js文件的data对象中定义

        小程序的js里面获取data数据的方式：

                this.data.变量名

        修改data里面的数据:

                this.setData({ 键1:值1...可以一次修改多个数据 })

02 for渲染

        wx:for="{{数组或者对象}}"

                默认的值变量：item

                默认的键的变量：index

                wx:for 需要定义wx:key="自定义一个名字"

        修改默认的变量名；

                wx:for-index='键变量新名字'

                wx:for-item="值变量新名字"

03 条件渲染

        wx:if="{{变量或者表达式}}"

        如果{{}}里面为false则元素不渲染

        如果想要让元素不显示  使用hidden属性 为true 表示隐藏 为false 表示显示

        搭配使用： wx:elif     wx:else

04 小程序中的事件

        bind:事件名称="事件驱动函数名"  冒泡

        catch:事件名称="事件驱动函数名"  没有冒泡

        点击  tap 小程序没有click

        函数定义在和data同级的位置直接写函数名即可

        事件类型:

              类型  触发条件  最低版本

              touchstart  手指触摸动作开始  

              touchmove 手指触摸后移动 

              touchcancel 手指触摸动作被打断，如来电提醒，弹窗  

              touchend  手指触摸动作结束  

              tap 手指触摸后马上离开 

              longpress 手指触摸后，超过350ms再离开，

               如果指定了事件回调函数并触发了这个事件，tap事件将不被触发 1.5.0

              longtap 手指触摸后，超过350ms再离开（推荐使用 longpress 事件代替） 

              transitionend 会在 WXSS transition 或 wx.createAnimation 动画结束后触发 

              animationstart  会在一个 WXSS animation 动画开始时触发 

              animationiteration  会在一个 WXSS animation 一次迭代结束时触发 

              animationend  会在一个 WXSS animation 动画完成时触发 

              touchforcechange  在支持 3D Touch 的 iPhone 设备，重按时会触发

05 事件对象event 及传参

        小程序的事件驱动函数一样也有event对象

        直接在事件驱动函数里面获取即可

        target 表示本次触发事件的那个对象

        currentTarget 表示绑定当前事件的那个原始元素

        事件传参

            bind:事件名称="事件驱动函数(传参)"  错误!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

            传参要通过data-* 属性  *代表自定义的属性名  

            data-*="{{变量或者除了字符串以外的其他类型的数据}}"

06 动态绑定

        小程序中没有vue中 v-bind指令

        如果标签上面的属性想要绑定一个变量或者表达式

        在属性值的双括号里面定义{{变量或者表达式}}  可以实现vue中v-bind的效果