小程序 模版与配置

news2024/12/23 14:36:49

WXML模版语法

一、数据绑定

1、数据绑定的基本原则

(1)在data中定义数据

(2)在WXML中使用数据

2、在data中定义页面的数据

3、Mustache语法的格式(双大括号)

4、Mustache语法的应用场景

(1)绑定内容

(2)绑定属性

(3)运算(三元运算、算术运算等)

5、动态绑定内容

6、动态绑定属性

7、三元运算

8、算术运算

二、WXML模版语法-事件绑定

1、小程序中常用的事件

2、事件对象的属性列表

3、target和currentTarget的区别

4、bindtap 的语法格式 (相当于鼠标点击事件)

5、在时间处理函数为data中的数据赋值

通过调用this.setData(dataObject)方法,可以给页面data中的数据重新赋值

6、事件传参

小程序中的事件传参比较特殊,不能在绑定事件的同时为事件处理函数传递参数

7、事件传参(正确)

可以为组件提供data-*自定义属性传参,其中*代表的是传参的名字

info会被解析为参数的名

数值2会被解析为参数的值

7、事件传参

在事件处理函数中,通过event.target.dataset.参数名,即可获取到具体参数的值

8、bindinput的语法格式

9、实现文本框和data之间的数据同步

实现步骤:

(1)渲染数据

(2)渲染结构

(3)美化样式

(4)绑定input事件处理函数

三、条件渲染

1、wx:if

2、结合<block>使用wx:if

如果要一次性控制多个组件的展示和隐藏,可以使用一个<block></block>标签将多个组件包装并在<block>标签上使用wx:if控制属性

注意:<block>并不是一个组件,只是一个包裹性质的容器,不会在页面中做任何渲染

3、hidden

直接使用也能控制元素的显示与隐藏

4、wx:if与hidden的对比

(1)运行方式不同

wx:if以动态创建和移除元素的方式,控制元素的展示与隐藏

hidden以切换样式的方式(display:none/block),控制元素的显示与隐藏

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2253762.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

智慧银行反欺诈大数据管控平台方案(四)

智慧银行反欺诈大数据管控平台的核心内容&#xff0c;是通过整合多维度、多层次的金融交易信息&#xff0c;利用先进的大数据分析、机器学习与人工智能算法&#xff0c;构建一个系统性、实时性和智能化的反欺诈管控网络&#xff0c;旨在提供全面、高效、精准的风险评估机制。该…

MSSQL2022的一个错误:未在本地计算机上注册“Microsoft.ACE.OLEDB.16.0”提供程序

MSSQL2022导入Excel的一个错误&#xff1a;未在本地计算机上注册“Microsoft.ACE.OLEDB.16.0”提供程序 一、导入情况二、问题发现三、问题解决 最近在安装新版SQLServer SSMS 2022后&#xff0c;每次导入Excel都会出现错误提示&#xff1a;未在本地计算机上注册“Microsoft.AC…

基于极角排序实现二维点的逆时针排列

在二维几何计算中,常常需要对一组点进行逆时针排序,以便用于构建多边形、实现凸包算法或绘制几何图形等。本文将详细介绍一种基于极角计算的方法,使用C++实现将点集按照逆时针顺序排列,并提供完整代码和输出示例,适合直接应用于工程项目或算法学习。 一、问题背景 在一个…

Hbase整合Mapreduce案例2 hbase数据下载至hdfs中——wordcount

目录 整合结构准备数据下载pom.xmlMain.javaReduce.javaMap.java操作 总结 整合结构 和案例1的结构差不多&#xff0c;Hbase移动到开头&#xff0c;后面跟随MR程序。 因此对于输入的K1 V1会进行一定的修改 准备 在HBASE中创建表&#xff0c;并写入数据 create "wunaii…

学习threejs,使用canvas更新纹理

&#x1f468;‍⚕️ 主页&#xff1a; gis分享者 &#x1f468;‍⚕️ 感谢各位大佬 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! &#x1f468;‍⚕️ 收录于专栏&#xff1a;threejs gis工程师 文章目录 一、&#x1f340;前言1.1 ☘️Texture 贴图 二、&#x1…

K8s 十年回顾(Ten Year Review of K8s)

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。Kubernetes 十年回顾 起源与…

AMR移动机器人赋能制造业仓储自动化升级

在当今制造业的激烈竞争中&#xff0c;智能化、数字化已成为企业转型升级的关键路径。一家制造业巨头&#xff0c;凭借其庞大的生产体系和多个仓库资源&#xff0c;正以前所未有的决心和行动力&#xff0c;在制造业智能化浪潮中勇立潮头&#xff0c;开启了降本增效的新篇章。这…

数据分析(一): 掌握STDF 掌握金钥匙-码农切入半导体的捷径

中国的半导体行业必然崛起&#xff01;看清这个大势&#xff0c;就会有很多机会。 今天&#xff0c;我们一起来了解一下半导体行业的一朵金花&#xff1a;STDF。 实际上这只是一种文件格式&#xff0c;但是当你熟练掌握解析这种文件的时候&#xff0c;你就已经打开在这个基础…

自动化测试之等待方式详解

&#x1f345; 点击文末小卡片 &#xff0c;免费获取软件测试全套资料&#xff0c;资料在手&#xff0c;涨薪更快 在自动化测试中&#xff0c;等待是一个重要的技术&#xff0c;用于处理页面加载、元素定位、元素状态改变等延迟问题。 等待能够确保在条件满足后再进行后续操…

Solving the Makefile Missing Separator Stop Error in VSCode

1. 打开 Makefile 并转换缩进 步骤 1: 在 VSCode 中打开 Makefile 打开 VSCode。使用文件浏览器或 Ctrl O&#xff08;在 Mac 上是 Cmd O&#xff09;打开你的 Makefile。 步骤 2: 打开命令面板 按 Ctrl Shift P&#xff08;在 Mac 上是 Cmd Shift P&#xff09;&…

HTML CSS JS基础考试题与答案

一、选择题&#xff08;2分/题&#xff09; 1&#xff0e;下面标签中&#xff0c;用来显示段落的标签是&#xff08; d &#xff09;。 A、<h1> B、<br /> C、<img /> D、<p> 2. 网页中的图片文件位于html文件的下一级文件夹img中&#xff0c;…

vulnhub靶场之momentum-2

前言 靶机采用virtual box虚拟机&#xff0c;桥接网卡 攻击采用VMware虚拟机&#xff0c;桥接网卡 靶机&#xff1a;momentum-2 192.168.1.40 攻击&#xff1a;kali 192.168.1.16 主机发现 使用arp-scan -l扫描 信息收集 使用namp扫描 这里的命令对目标进行vulner中的漏…

Hadoop生态圈框架部署(八)- Hadoop高可用(HA)集群部署

文章目录 前言一、部署规划二、Hadoop HA集群部署&#xff08;手动部署&#xff09;1. 下载hadoop2. 上传安装包2. 解压hadoop安装包3. 配置hadoop配置文件3.1 虚拟机hadoop1修改hadoop配置文件3.1.1 修改 hadoop-env.sh 配置文件3.3.2 修改 core-site.xml 配置文件3.3.3 修改 …

Flink问题总结

目录 1、Flink 的四大特征(基石) 2、Flink 中都有哪些 Source,哪些 Sink,哪些算子(方法) 3、什么是侧道输出流,有什么用途 4、Flink 中两个流如何合并为一个流 5、Flink 中两个流如何 join 6、Flink 中都有哪些 window,什么是滑动,滚动窗口 7、flink 中都有哪些…

数据结构 (26)图的遍历

前言 数据结构中的图遍历是指从图中的任一顶点出发&#xff0c;按照某种方法访问图中的所有顶点&#xff0c;且每个顶点只访问一次。 一、遍历方法 遍历主要有两种方法&#xff1a;深度优先搜索&#xff08;DFS&#xff09;和广度优先搜索&#xff08;BFS&#xff09;。 1.深度…

【后端面试总结】golang channel深入理解

在Go语言中&#xff0c;Channel是一种用于在goroutine之间进行通信和同步的重要机制。它提供了一种安全、类型安全的方式来传递数据&#xff0c;使得并发编程变得更加直观和简单。本文将详细介绍Golang中Channel的基本概念、创建与关闭、发送与接收操作&#xff0c;以及相关的使…

RabbitMQ消息可靠性保证机制6--可靠性分析

在使用消息中间件的过程中&#xff0c;难免会出现消息错误或者消息丢失等异常情况。这个时候就需要有一个良好的机制来跟踪记录消息的过程&#xff08;轨迹溯源&#xff09;&#xff0c;帮助我们排查问题。 在RabbitMQ中可以使用Firehose实现消息的跟踪&#xff0c;Firehose可…

RAG评估指南:从检索到生成,全面解析LLM性能评估方法

前言 这一节我们将从时间线出发对RAG的评估方式进行对比&#xff0c;这些评估方式不仅限于RAG流程之中&#xff0c;其中基于LLM的评估方式更加适用于各行各业。 RAG常用评估方式 上一节我们讲了如何用ROUGE 这个方法评估摘要的相似度&#xff0c;由于篇幅限制&#xff0c;没…

高危端口汇总(Summary of High-Risk Ports)

高危端口汇总 能关闭就关闭 &#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解…

电子病历静态数据脱敏路径探索

一、引言 数据脱敏&#xff08;Data Masking&#xff09;&#xff0c;屏蔽敏感数据&#xff0c;对某些敏感信息&#xff08;比如patient_name、ip_no、ad、no、icd11、drug等等 &#xff09;通过脱敏规则进行数据的变形&#xff0c;实现隐私数据的可靠保护。电子病历作为医疗领…