微信小程序基础知识点

最新推荐文章于 2024-09-12 20:30:50 发布

圣京都

最新推荐文章于 2024-09-12 20:30:50 发布

阅读量466

点赞数

分类专栏：小程序文章标签：小程序

本文链接：https://blog.csdn.net/qq_40994735/article/details/109121321

版权

小程序专栏收录该内容

2 篇文章 1 订阅

订阅专栏

模板语法

1 文本渲染

<view> {{msg}} </view >

2 条件渲染

data:{isLog:true}
<view wx:if="{{isLog}}"欢迎回来</view>
<view wx:else="{{isLog}}"请登录</view>

3 列表渲染

data:{list:["java","python","小程序"]}
<view wx:for="{{list}}" wx:key="{{index}}">{{item}}</view>

4事件绑定

<view bindtap="tapHd" data-item="我喜欢">
tapHd(e){
let item=e.currentTarget.dataset.item;
wx.showToast({title:item,icon:"none"})
}

更新视图与数

表单双向绑定

<input value="{{msg}}" bindinput= "inputHd">
inputHd(e){
 this.setData({msg:e.detail.value}）
 }
 e.detail.value 表单的值

list数据添加

<input value="{{msg}}" bindconfirm="confirmHD">
var list = this.data.list;
list.unshift(this.data.msg)
this.setData({list})

list数据删除

<text bindtap="deleteHD" data-index="{{index}}">*</text>
deleteHD(e){
    var index=e.currentTarget.dataset.index;//获取事件参数index值
    var list = this.data.list;//获取list数据
    list.splice(index,1);//从index删除一个
    this.setData({list})//更新列表
  }