爱吃凉拌辣芒果的博客

本文主要介绍了小程序开发中自定义组件的相关知识。包括组件的创建与引用，可在项目根目录创建组件文件夹，生成相应文件，并根据使用频率选择全局或局部引用。还阐述了组件和页面的区别，如组件的.json 文件需声明 “component: true”，.js 文件调用 Component () 函数等。在样式方面，组件默认样式隔离，能防止内外样式干扰，同时指出了样式隔离的注意点和修改选项，可选值包括 isolated、apply-shared 和 shared。通过这些知识，能更好地进行小程序的开发，提高代码的复用性

本文介绍了WXS（WeiXin Script）是小程序独有的脚本语言，结合 WXML 构建页面结构。其应用场景主要是作为 “过滤器”，wxml 可调用 wxs 定义的函数但不能调用页面.js 中的函数。WXS 语法与 JavaScript 类似但有区别，有自己的数据类型，不支持 ES6 及以上语法，遵循 CommonJS 规范。WXS 代码可内嵌在 wxml 文件的标签内，需指定 module 属性，也可定义在外联的.wxs 文件中，在 wxml 中通过的 module 和 src 属性

本文介绍了小程序的生命周期，包括生命周期的定义、分类、生命周期函数等内容。生命周期分为应用生命周期和页面生命周期，生命周期函数由小程序框架提供，会按次序自动执行，开发人员可利用这些函数在特定时间点执行操作，如在页面加载时初始化数据。

本文主要介绍了微信小程序开发中与数据加载相关的两个功能点：(1)添加` loading`提示效果在数据加载时，使用`wx.showLoading()`展示加载提示，如 `wx.showLoading({ title: '数据加载中...' });`。数据请求完成后，使用`wx.hideLoading()`隐藏加载提示。(2)对上拉触底进行节流处理实现方式：在`data`中定义布尔型节流阀`isLoading`，在`getColors()`方法中设置其状态

本文介绍了微信小程序的两种页面事件 —— 下拉刷新事件和上拉触底事件，具体内容如下：（1）下拉刷新事件概念：通过手指下拉屏幕重新加载页面数据。启用方式：包括全局和局部开启，推荐局部开启。配置样式：可通过backgroundColor和backgroundTextStyle配置下拉刷新窗口样式。事件处理：在.js文件中用onPullDownRefresh()监听，处理完后需调用wx.stopPullDownRefresh()停止刷新。（2）上拉触底事件概念：通过手指上拉屏幕加载更多数据。

本文主要介绍了微信小程序的页面导航相关知识，包括定义、实现方式、导航传参等内容。具体如下：(1)导航方式声明式导航：通过在页面上声明``导航组件，可实现页面间跳转，包括跳转到 tabBar 页面、非 tabBar 页面和后退导航。编程式导航：调用小程序的导航 API，如`wx.switchTab()`、`wx.navigateTo()`、`wx.navigateBack()`等方法进行页面跳转。(2)导航传参传参方式：声明式导航可在`url`后携带参数，编程式导航可在调用方法

本文介绍了微信小程序的页面配置与网络数据请求。页面配置文件可对单个页面进行个性化设置，与全局配置冲突时以页面配置为准。网络数据请求有严格限制，包括只能用 HTTPS 接口并添加到信任列表。可通过wx.request()发起 GET 和 POST 请求，能在页面加载时自动请求数据。若后端接口不满足要求可临时跳过域名校验，且小程序不存在跨域问题，与传统 Ajax 不同。

本文介绍了微信小程序中的 tabBar，包括其定义、组成部分、节点配置项和每个 tab 项的配置选项。还通过案例详细说明了配置 tabBar 的步骤，如拷贝图标资源、新建 tab 页面和配置 tabBar 选项等。tabBar 可实现多页面快速切换，合理配置能提升用户体验。

本文介绍了微信小程序全局配置文件 app.json 中的常用配置项，重点阐述了 window 节点的各项配置，包括导航栏标题文字、背景色、标题颜色，窗口背景色、下拉刷新样式以及上拉触底距离等。通过这些配置可实现小程序窗口外观的个性化设置，提升用户体验。

本文介绍了微信小程序开发中内边距（padding）和外边距（margin）的概念及作用。内边距是元素内容与边框间的距离，可调整文字与边框的间隔；外边距是元素边框与相邻元素间的距离，用于控制元素间隔及实现水平居中。合理运用这两个属性可实现美观、合理的页面设计。

本文主要介绍了微信小程序开发中的 WXSS。WXSS 类似于网页开发中的 CSS，具有其大部分特性同时又有扩展，如 rpx 尺寸单位、@import 样式导入等。其中 rpx 是解决屏适配的独特单位，有特定实现原理和不同设备的换算方式。@import 可导入外联样式表，有明确语法格式和示例。此外还介绍了全局样式和局部样式，局部样式在冲突时可根据就近原则覆盖全局样式。总之，WXSS 在微信小程序开发中起着重要的页面美化和布局作用。

本文主要介绍了小程序 WXML 模板语法中的条件渲染和列表渲染。条件渲染包括使用`wx:if`进行条件判断，可结合`wx:elif`和`wx:else`，还能结合``控制多个组件的显示隐藏；同时介绍了`hidden`属性控制元素显示隐藏，并对比了`wx:if`与`hidden`在运行方式和使用场景上的不同。列表渲染方面，通过wx:for根据数组循环渲染组件，可使用`wx:for-index`和`wx:for-item`指定索引和当前项变量名，以及使用wx:key为列表项指定唯一值提高渲染效率

本文主要介绍了小程序中 WXML 模板语法的事件绑定相关知识。首先阐述了事件是渲染层到逻辑层的通讯方式，包括交互事件的过程。接着介绍了小程序中常用的事件，如 tap、input 和 change 及其绑定方式和事件描述。详细说明了事件对象的属性列表，包括 type、timeStamp、target、currentTarget、detail、touches 和 changedTouches。讲解了 bindtap 的语法格式，以及在事件处理函数中为 data 中的数据赋值的方法。还介绍了小程序中特殊的事件传参

本文介绍微信小程序开发的两部分内容。一是宿主环境的 API，包括 API 概述及事件监听、同步、异步三大分类并举例。二是 WXML 模板语法的数据绑定，涵盖基本原则、data 中定义数据、Mustache 语法格式及应用场景（绑定内容、属性、运算）并举例。

本文介绍微信小程序部分组件。基础内容组件包括 text（类似 span，可通过 selectable 实现长按选中文本）和 rich - text（渲染 HTML 为 WXML）。其它常用组件有 button（功能丰富，通过 open - type 调用微信功能）、image（默认宽高约 300px、240px，通过 src 显示图片，有多种 mode 属性）和 navigator（类似 a 链接），并给出相关代码示例。

本文介绍小程序组件相关知识。包括组件分类为 9 大类，重点阐述视图容器类组件，如 view 用于页面布局，scroll - view 用于滚动列表，Swiper 和 swiper - item 用于轮播图，并给出相关组件属性及对应 wxml 和 wxss 代码示例。

本文介绍小程序宿主环境相关知识。包括宿主环境定义，小程序宿主环境为手机微信（涵盖安卓和 iOS 系统下的微信）且可实现特殊功能。还阐述了其包含的通信模型（通信主体为渲染层和逻辑层，通信由微信客户端转发）、运行机制（小程序启动及页面渲染过程）等内容。

本文介绍了微信小程序开发的几个知识点，包括新建页面（在 app.json 的 pages 中新增路径自动创建文件）、修改首页（调整 app.json 中 pages 数组顺序）、WXSS 知识（定义、与 CSS 区别）以及.js 文件分类（app.js 为项目入口，页面.js 为页面入口，普通.js 为功能模块）

首先阐述了小程序与普通网页开发在运行环境、API 和开发模式上的区别。接着详细说明了小程序代码的构成，包括项目结构中的 pages 目录、utils 目录、app.js、app.json、app.wxss、project.config.json 和 sitemap.json 等部分的作用。然后介绍了小程序页面由.js、.json、.wxml 和.wxss 四个基本文件组成。最后讲解了 JSON 配置文件的作用及种类，包括 app.json、project.config.json、sitemap.json等