【web】微信小程序笔记小结（自定义组件+npm包+全局数据共享+分包）

  一起加油~！

来源：黑马程序员前端微信小程序开发教程

目录

I. 自定义组件

① 创建

② 引用

1）局部引用

2）全局引用

 3）对比

4）页面和组件的区别

③ 样式

1）组建样式隔离

2）注意点

3）修改

 4）stylelsolation 的可选值

④ 数据、方法和属性

1）data 数据

2）methods 方法

3）properties 属性

4）data 和 properties 的区别

5）使用 setData 修改 properties 的值 

⑤ 数据监听器

1）概念

2）基本用法

3）监听对象属性的变化

 4）案例（没写）

※※ 效果

⑥ 纯数据字段 

1）概念

2）使用规则 

3）使用纯数据字段改造数据监听器案例

⑦ 组件的生命周期

1）全部生命周期函数

2）主要

3）lifetimes 节点 

⑧ 组件所在页面的生命周期

1）概念

 2）pageLifetimes 节点

3）生成随机的 RGB 颜色值 

⑨ 插槽

1）概念

2）单个插槽

3）多个插槽

※※ 启用

※※ 定义

⑩ 组件通信

1）方式

2）属性绑定 父 → 子

3）事件绑定 子 → 父

4）获取实例

5）behaviors

※※ 概念

※※ 工作方式

※※ 创建

※※ 导入并使用

※※ 所有可用节点

※※ 同名字段的覆盖和组合规则 * 

✿ 总结

II. npm 包

① 小程序对 npm 的支持与限制

② Vant Weapp

1）安装 Vant 组件库

2）使用

3）定制全局主题样式

③ API Promise 化

1）基于回调函数的异步 API 的缺点

2）概念

3）实现

4）调用 Promise 化之后的异步 API 

III. 全局数据共享

① 概念

② 小程序中的全局数据共享方案

③ Mobx

1）安装 

2）创建 Mobx 的 Store 实例

3）将 Store 中的成员绑定到页面中

4）在页面上使用 Store 中的成员 

5）将 Store 中的成员绑定到组件中

6）在组件中使用 Store 中的成员

IV. 分包

① 基础概念

② 基本用法 

1）配置方法

2）打包原则

3）引用原则

③ 独立分包 

1）概念

2）与普通分包的区别

3）应用场景

4）配置方法 

5）引用原则 

④ 分包预下载

1）概念

2）配置

3）限制

---

I. 自定义组件

① 创建

② 引用

1）局部引用

2）全局引用

 3）对比

4）页面和组件的区别

③ 样式

1）组建样式隔离

2）注意点

3）修改

 4）stylelsolation 的可选值

④ 数据、方法和属性

1）data 数据

2）methods 方法

3）properties 属性

4）data 和 properties 的区别

5）使用 setData 修改 properties 的值 

⑤ 数据监听器

1）概念

2）基本用法

3）监听对象属性的变化

 4）案例（没写）

※※ 效果

⑥ 纯数据字段 

1）概念

2）使用规则 

3）使用纯数据字段改造数据监听器案例

⑦ 组件的生命周期

1）全部生命周期函数

2）主要

3）lifetimes 节点 

⑧ 组件所在页面的生命周期

1）概念

 2）pageLifetimes 节点

3）生成随机的 RGB 颜色值 

⑨ 插槽

1）概念

2）单个插槽

3）多个插槽

※※ 启用

※※ 定义

⑩ 组件通信

1）方式

2）属性绑定 父 → 子

3）事件绑定 子 → 父

4）获取实例

5）behaviors

※※ 概念

※※ 工作方式

※※ 创建

※※ 导入并使用

※※ 所有可用节点

※※ 同名字段的覆盖和组合规则 * 

✿ 总结

II. npm 包

① 小程序对 npm 的支持与限制

② Vant Weapp

1）安装 Vant 组件库

步骤网址 → 快速上手 Vant

2）使用

3）定制全局主题样式

Vant Weapp 使用 CSS 变量 来实现定制主题 → 基本用法 颜色配置文件

③ API Promise 化

1）基于回调函数的异步 API 的缺点

2）概念

3）实现

4）调用 Promise 化之后的异步 API 

III. 全局数据共享

① 概念

② 小程序中的全局数据共享方案

③ Mobx

1）安装 

2）创建 Mobx 的 Store 实例

3）将 Store 中的成员绑定到页面中

4）在页面上使用 Store 中的成员 

5）将 Store 中的成员绑定到组件中

6）在组件中使用 Store 中的成员

IV. 分包

① 基础概念

• 分包指的是把一个完整的小程序项目，按照需求划分为不同的子包，在构建时打包成不同的分包，用户在使用时 按需进行加载 
• 对小程序进行分包的好处主要有以下两点：

1. 可以 优化小程序首次启动的下载时间 
2. 在 多团队共同开发 时可以更好的解耦协作

• 分包前项目的构成

•  分包后项目的构成

•  加载规则

• 体积限制 

② 基本用法 

1）配置方法

2）打包原则

3）引用原则

③ 独立分包 

1）概念

2）与普通分包的区别

3）应用场景

4）配置方法 

5）引用原则 

④ 分包预下载

1）概念

 分包预下载指的是：在进入小程序的某个页面时，由框架自动预下载可能需要的分包，从而提升进入后续分包页面时的启动速度

2）配置

3）限制

---

恭喜看到这的小伙伴，你已经完成微信小程序基础加强部分的学习了~！！

以后准备预习期末考了orz，祝我好运kkk！

 欢迎点赞评论收藏嘿嘿嘿~ ！