2024.2.5日总结(小程序开发2)

小程序的宿主环境

宿主环境

宿主环境指的是程序运行所必须的依赖环境。

Android系统和iOS系统是两个不同的宿主环境。安卓版的微信App不能再iOS环境下运行。Android是安卓软件的宿主环境,脱离了宿主环境的软件是没有意义的。

小程序的宿主环境

手机微信是小程序的宿主环境,小程序借助宿主环境提供的能力,可以完成许多普通网页无法完成的功能:微信扫码,微信支付,微信登录,地理位置等

小程序宿主环境包括的内容

通信模型
  • 渲染层和逻辑层之间的通信(由微信客户端进行转发)
  • 逻辑层和第三方服务器之间的通信(由微信客户端进行转发)

通信的主体

小程序中通信的主体是渲染层和逻辑层

  • WXML模板和WXSS样式工作在渲染层
  • JS脚本工作在逻辑层

运行机制

小程序启动过程:

  1. 把小程序的代码包下载到本地
  2. 解析app.json全局配置文件
  3. 执行app.js小程序入喉文件,调用App()创建小程序实例
  4. 渲染小程序首页
  5. 小程序启动

页面渲染过程:

  1. 加载解析页面的.json配置文件
  2. 加载页面的.wxml模板和.wxss样式
  3. 执行页面的.js文件,调用Page()创建页面实例
  4. 页面渲染完成
组件

小程序的组件是由宿主环境提供的:

  • 视图容器

view

普通视图区域

类似于html中的div,块级元素

用来实现页面的布局效果

scroll-view

可滚动的视图区域

常用来实现滚动列表效果

swiper和swiper-item

轮播图容器组件和轮播图item组件

  • 基础内容

text

文本组件

类似于html中的span标签,是一个行内元素

通过text的selectable属性,可以实现长按选中文本内容的效果

rich-text

富文本组件

支持把html字符串渲染为wxml结构

image

image组件的mode属性来制定图片的裁剪和缩放模式,常用的mode属性:

  • 表单组件
  • 导航组件
API

小程序中的API由宿主环境提供。

API有三大类
  • 事件监听API

以on开头,用来监听某些时间的触发

  • 同步API

以Sync结尾的API都是同步API

同步API的执行结果,可以通过函数返回值直接获取,如果执行出错会抛出异常

  • 异步API

类似于jQuery中的$.ajax(options)函数,需要通过success,failcomplete接收调用的结果

WXML模板语法

事件绑定

常用的事件

 事件对象的属性列表

事件回调触发的时候,会收到一个事件对象event,他的详细属性:

target和currentTarget的区别:

target是触发改时间的源头组件,e.target是内部的按钮组件,currentTarget是当前事件绑定的组件,e.currentTarget是当前的view组件。

wx:if和hidden的对比:

wx:if以动态创建和移除元素的方式,控制元素的展示和隐藏,hidden以切换样式的方式(display: none/block;),控制元素的显示与隐藏。

全局配置-table

backgroundColor: tabBar的背景色

selectedIconPath:选中时的图片路径

borderStyle:tabBar上边框的颜色

iconPath:未选中的图片路径

selectedColor: tab上的文字选中的颜色

color:tab上的文字默认(未选中)颜色

tabBar节点配置项:

每个tab项的配置选项:

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

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

相关文章

黑豹程序员-ElementPlus支持树型组件带图标以及icon避坑

效果 vue代码 参数说明&#xff1a;node当前节点&#xff0c;data当前节点后台传入数据。 el-tree自身不支持图标&#xff0c;需要自己去利于实现&#xff0c;并有个坑&#xff0c;和elementui写法不同。 <el-col :span"12"><el-form-item label"绑定…

VC++添加菜单学习

新建一个单文档工程&#xff1b; 完成以后看一下有没有出现如下图的 资源视图 的tab&#xff1b;如果没有&#xff0c;在文件列表中找到xxx.rc2文件&#xff1b; 点击 资源视图 的tab&#xff0c;或者双击 .rc2 文件名&#xff0c;就会转到如下图的资源视图&#xff1b;然后展…

mysql是如何使用索引的?

摘自官网 MySQL使用索引进行以下操作: WHERE条件中,快速查找匹配的行。(快速查询数据) 从准备查询的数据中消除多余行。如果可以在多个索引之间进行选择,则MySQL通常会使用查找最少行数的索引。 如果表具有多列索引,那么优化器可以使用索引的任何最左前缀来查找行。 举例来…

算法题目题单+题解——图论

简介 本文为自己做的一部分图论题目&#xff0c;作为题单列出&#xff0c;持续更新。 题单由题目链接和题解两部分组成&#xff0c;题解部分提供简洁题意&#xff0c;代码仓库&#xff1a;Kaiser-Yang/OJProblems。 对于同一个一级标题下的题目&#xff0c;题目难度尽可能做…

MySQL的触发器

一&#xff1a;概述 &#xff08;1&#xff09;介绍 &#xff08;2&#xff09;特性 二&#xff1a;基本操作 -- 用户表 create table user(uid int primary key,username varchar(50) not null,password varchar(50) not null );-- 用户信息操作日志表 create table user_…

如何有效降低商业电子邮件被盗的风险?

一、什么是商业电子邮件泄露&#xff1f; 你是否曾经经历过信任某人&#xff0c;但最终却被背叛的痛苦&#xff1f;在商业环境中&#xff0c;业务电子邮件泄露&#xff08;BEC&#xff09;就是一种通过电子邮件方式被你信任的人背叛的情况。然而&#xff0c;与人际关系中的背叛…

07.你还在手动部署代码吗

如今的项目或者个人项目中,大家的代码怎么部署呢?公司一般都有完整的持续集成以及持续交付平台,对于小公司可能也有各自搭建了一些,比如jenkins,以及gitlab集成的gitlab-ci等等,这些都可以完成我们部署的工作甚至是测试集成等等一系列流水化工作。 但是,即使如此,我依…

软件测试-造数工具Faker简介

这里的Faker不是英雄联盟的Faker。。。 一、Python Faker 简介 Python Faker 是一个用于生成假数据的Python库。它允许开发者快速创建具有随机特征的虚构数据&#xff0c;这对于测试、填充数据库以及其他需要模拟真实数据的场景非常有用。Python Faker 提供了各种数据类型的生…

【经典例子】Java实现2048小游戏(附带源码)

一、游戏回顾 2048游戏是一款数字益智游戏&#xff0c;目标是通过合并相同数字的方块来达到2048这个目标。游戏在一个4x4的方格上进行&#xff0c;每个方格上都有一个数字&#xff08;初始时为2或4&#xff09;。玩家可以通过滑动方向键&#xff08;上、下、左、右&#xff09;…

这是一篇学习记录(一) — RPA

犹豫再三要不要记录一下这次的学习历程&#xff0c;说起RPA&#xff0c;可能很多人不了解&#xff0c;那么RPA到底是什么&#xff0c;它有什么用处。 机器人流程自动化 (RPA)&#xff0c;又称为软件机器人&#xff0c;是一种利用智能自动化技术来模拟人类执行后台任务的方法。…

静态代码块中使用 ExecutorService 执行多线程会出现什么情况呢?

AQS系列 1、AQS核心原理 2、ReentrantLock 原理及示例 3、CountDownLatch / Semaphore 示例及使用场景 4、BlockingQueue 示例及使用场景 5、静态代码块中使用 ExecutorService 执行多线程会出现什么情况呢&#xff1f; 文章目录 AQS系列一、 一般场景二、static {} 场景三、原…

AD高速板常见问题和过流自锁

可以使用电机减速器来增大电机的扭矩&#xff0c;低速运行的步进电机更要加上减速机 减速电机就是普通电机加上了减速箱&#xff0c;这样便降低了转速增大了扭矩 HDMI布线要求&#xff1a; 如要蛇形使其等长&#xff0c;不要在HDMI的一端绕线。 HDMI走线时两边拉线&#xff0…

忘记 RAG:拥抱Agent设计,让 ChatGPT 更智能更贴近实际

RAG&#xff08;检索增强生成&#xff09;设计模式通常用于开发特定数据领域的基于实际情况的ChatGPT。 然而&#xff0c;重点主要是改进检索工具的效率&#xff0c;如嵌入式搜索、混合搜索和微调嵌入&#xff0c;而不是智能搜索。 这篇文章介绍了一种新的方法&#xff0c;灵感…

信创ARM架构QT应用开发环境搭建

Linux ARM架构QT应用开发环境搭建 前言交叉工具链Ubuntu上安装 32 位 ARM 交叉工具链Ubuntu上安装 64 位 ARM 交叉工具链 交叉编译 QT 库下载 QT 源码交叉编译 QT 源码 Qt Creator交叉编译配置配置 Qt Creator Kits创建一个测试项目 小结 前言 有没有碰到过这种情况&#xff1…

15、jenkins

15、jenkins k8s手撕yml方式部署最新版 Jenkins 2.441&#xff08;jdk-21版&#xff09;&#xff08;jenkins-prod&#xff09; mkdir -p ~/jenkins-prod-ymlkubectl create ns jenkins-prodkubectl label node k8s-node1 jenkins-prodjenkins-prodcat > ~/jenkins-prod-y…

vivado TCL运行编译

用Tcl运行合成 运行合成的Tcl命令是synth_design。通常&#xff0c;此命令与一起运行多个选项&#xff0c;例如&#xff1a; synth_design -part xc7k30tfbg484-2 -top my_top 在本例中&#xff0c;synth_design使用-part选项和-top选项运行。在Tcl控制台中&#xff0c;您可以…

layui

基于复杂结构的自定义模版相关介绍 我这里的接口给的格式数据 我这里搜索往返时候要显示成这样的 layui.use([table,form], function(){ var table layui.table; var form layui.form;// 渲染表格 table.render({ elem: #test-table-reload,toolbar: #toolbarDemo, …

【驱动】块设备驱动(四)-块设备驱动层

前言 块设备驱动程序是Liux块子系统中的最底层组件。它们从IO调度程序中获得请求&#xff0c;然后按要求处理这些请求。一个块设备驱动程序可能处理几个块设备。例如&#xff0c;IDE设备驱动程序可以处理几个IDE磁盘&#xff0c;其中的每个都是一个单独的块设备。而且&#xff…

json、jsonlines格式化显示

一、对于vscode暂时没找到合适的方法来格式化 二、利用JetBrains的IDE(例如PyCharm)来格式化(快捷键CtrlAltL) 三、利用jq工具&#xff1a;(速度快&#xff0c;推荐。) # 安装 sudo apt install jq# 使用&#xff08;假设你已经有一个dev.jsonlines文件&#xff09; jq . dev.…

数据库删除事务提交之后数据恢复

项目场景&#xff1a; 前几天的遇到的&#xff0c;老大让我删一条数据&#xff0c;不熟悉业务&#xff0c;我看了一下查询的sql语句&#xff0c;发现关联了三个表t1,t2,t3&#xff0c;把第三张表t3填报记录删掉了&#xff0c;又运行了一遍查询sql发现还能搜索到&#xff0c;问…