微信小程序-03

这篇具有很好参考价值的文章主要介绍了微信小程序-03。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

小程序官方把 API 分为了如下 3 大类:
事件监听 API
特点:以 on 开头,用来监听某些事件的触发
举例:wx.onWindowResize(function callback) 监听窗口尺寸变化的事件
同步 API
特点1:以 Sync 结尾的 API 都是同步 API
特点2:同步 API 的执行结果,可以通过函数返回值直接获取,如果执行出错会抛出异常
举例:wx.setStorageSync(‘key’, ‘value’) 向本地存储中写入内容
异步 API
特点:类似于 jQuery 中的 $.ajax(options) 函数,需要通过 success、fail、complete 接收调用的结果
举例:wx.request() 发起网络数据请求,通过 success 回调函数接收数据

动态绑定

<view>{{info}}</view>
<image src="{{imgSrc}}"></image>
<view> {{randomNum>=5 ?"数字大于等于5":"数字小于5"}}</view>

事件是渲染层到逻辑层的通讯方式。通过事件可以将用户在渲染层产生的行为,反馈到逻辑层进行业务的处理
微信小程序-03,微信小程序,小程序
事件对象属性
微信小程序-03,微信小程序,小程序
target 是触发该事件的源头组件,而 currentTarget 则是当前事件所绑定的组件。

//在事件处理函数中为 data 中的数据赋值
countChange(){
  this.setData({
    count: this.data.count+1
  })
},


//参数传递			data-参数名			e.target.dataset.参数名
<button type="primary" bindtap="btnTap2" data-info="{{2}}">2</button>

btnTap2(e){
this.setData({
  count: this.data.count+e.target.dataset.info,
})
},



//input实时获取输入		e.detail.value
<input bindinput="inputHandler"></input>

inputHandler(e){
console.log(e.detail.value)
},

条件渲染

<view wx:if="{{type==1}}"></view>
<view wx:elif="{{type==2}}"></view>
<view wx:else>保密</view>

//多个组件
<block wx:if="{{type===1}}">
  <view>View2</view>
  <view>View2</view>
</block>


<view hidden="{{flag}}">条件为true时隐藏</view>

wx:if 与 hidden 的对比:
运行方式不同
wx:if 以动态创建和移除元素的方式,控制元素的展示与隐藏
hidden 以切换样式的方式(display: none/block;),控制元素的显示与隐藏
使用建议
频繁切换时,建议使用 hidden
控制条件复杂时,建议使用 wx:if 搭配 wx:elif、wx:else 进行展示与隐藏的切换

列表渲染 wx:for 可以根据指定的数组,循环渲染重复的组件结构文章来源地址https://www.toymoban.com/news/detail-817848.html

arr1:['小红','小白','小蓝']

<view wx:for="{{arr1}}">
  索引:{{index}},当前项:{{item}}
</view>


userList:[
  {id:1,name:"小明"},
  {id:2,name:"小花"},
  {id:3,name:"小张"},
]

<view wx:for="{{userList}}" wx:key="id">{{item.name}}</view>

到了这里,关于微信小程序-03的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序入门03-搭建权限系统,建库建表

    我们准备零基础搭建一个小程序,小程序分为两部分,一个是用户访问的程序,可以是小程序也可以是H5。另外一个就是管理员使用的管理后台,后台第一个要实现的就是搭建权限系统。为了搭建权限系统,我们先需要梳理概念 我们首先问一下chatgpt如何设计一个权限系统 设

    2024年02月09日
    浏览(42)
  • 微信小程序毕业设计作品成品(03)在线投票小程序投票评选小程序系统设计与实现

    博主介绍 :《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者,CSDN博客专家,在线教育专家,CSDN钻石讲师;专注大学生毕业设计教育和辅导。 所有项目都配有从入门到精通的基础知识视频课程,免费 项目配有对应开发文档、开题报告、任务书、PPT、论文模版

    2024年02月08日
    浏览(44)
  • 微信小程序显示loading效果,微信小程序节流效果,微信小程序生命周期,微信小程序组件的创建与使用

            文档地址:wx.showLoading(Object object) | 微信开放文档         请求前 显示loading 效果 ,请求结束后隐藏loading         下拉触底需要时间比较长,但是可能会一直进行请求,我们可以 设置一个 加载状态 ,用来控制什么时候 才可以加载         当我们loading 效果为tr

    2024年02月10日
    浏览(66)
  • 微信小程序 全局配置||微信小程序 页面配置||微信小程序 sitemap配置

    小程序根目录下的 app.json 文件用来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。 以下是一个包含了部分常用配置选项的 app.json : 每一个小程序页面也可以使用同名 .json 文件来对本页面的窗口表现进行配置,页面中配

    2024年02月01日
    浏览(44)
  • 微信小程序 -- 微信小程序发送红包

    参考链接:微信小程序 – 微信小程序发送红包 组织参数 点击查看微信的文档 发送示例 拼接参数(ASCII码从小到大排序(字典序)) 加密参数 将参数实体转换成xml格式 最后就是发送请求 相信发送post请求大家都不陌生了吧 最后就是对微信返回的参数进行解析,建议遇到问

    2024年02月10日
    浏览(40)
  • 【微信小程序】初识微信小程序

    作者简介:一名C站萌新,前来进行小程序的前进之路 博主主页:大熊李子的主页🐻 微信小程序 是一种可以通过扫码或搜索即可进入使用的应用,减少了 下载安装 的环节,实现用户对于应用“触手可及、用完即走”的理想需求。在微信公众平台,小程序是与服务号、订阅号

    2023年04月21日
    浏览(47)
  • 微信小程序-微信小程序登录流程(一)

    微信小程序,小程序的一种,英文名Wechat Mini Program,是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用 冷启动: 小程序首次打开或销毁后再次被打开,此时小程序需要重新加载启动,即冷启动。会检查小程序是否

    2024年02月11日
    浏览(39)
  • 【微信小程序】实现微信小程序登录(附源码)后端,微信小程序获取手机号

    登录简介 第一步:获取token 第二步:通过token拿用户信息 第三步:调用接口获取手机号 HttpClientUtil: WeChatUtil: controller层: service层: serviceImpl层: 登录简介        新版本微信小程序登录 是前端获取用户信息,不再是后端获取信息进行保存。所以后端要做的主要流程就是

    2024年04月23日
    浏览(58)
  • 微信小程序之微信登陆-——-微信小程序教程系列

    }) 黄色标注的部分就是登陆部分 下面详细介绍微信小程序的微信登陆 第一步:获取登陆态code 微信登陆部分,首先需要使用微信小程序的api—— wx.login(OBJECT)来获取登录态 这个登陆态的作用是为了获取用户的openid(用户的唯一标识) 相关链接:https://mp.weixin.qq.com/debug/wxadoc

    2024年04月23日
    浏览(54)
  • 亲测微信小程序备案流程,微信小程序如何备案,微信小程序备案所需准备资料

    微信小程序为什么要备案,微信官方给出如下说明: 1、若微信小程序未上架,自2023年9月1日起,微信小程序须完成备案后才可上架; 2、若微信小程序已上架,请于2024年3月31日前完成备案,逾期未完成备案,平台将按照备案相关规定于2024年4月1日起进行清退处理。 备案系统

    2024年02月07日
    浏览(56)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包