美文网首页
2.1 小程序核心语法

2.1 小程序核心语法

作者: LucXion | 来源:发表于2023-10-06 11:44 被阅读0次
    1. 页面内引用的对象,必须在对应的.js文件中声明,通过关键字Page + data
    Page ({
        data : {
            product : {
                price : 10,
                num : 5
            }
        }
    )} 
    
    1. 给按钮添加点击事件 + 传值
    // bind:tap
    <button bind:tap="btnClick_numAdd_1">num + 1</button>
    // bind:tap + data-step
    <button bind:tap="btnClick_numAdd_N" data-step="5">num + N</button>
    // 值的接收 .js 文件:
    btnClick_numAdd_N(event){
        console.log(event.target.dataset.step)
    }
    

    3.双向绑定:读 + 写

    // 以 input 输入框组件为例, 读 value , 写 bindinput
    <input class="productM" type="num" bindinput="InputEvent" value="{{product.num}}"/>
    

    4..wsml中,如果要引用.js中的数据,要用 {{}} 包裹

    {{product.num}}
    

    5..js 中,通过setdata赋值,会触发刷新,所有与该值相关的组件都会刷新。

    • 通过 ({}) 包裹数据;
    • 以键值对的形式赋值;
    • 二级key用''引用;
    this.setData ({
       'product.num' : this.data.product.num + parseInt(event.target.dataset.step)
    })
    

    相关文章

      网友评论

          本文标题:2.1 小程序核心语法

          本文链接:https://www.haomeiwen.com/subject/fkipbdtx.html