解决什么问题：跨框架理解与业务选型

很多前端开发者或后端转前端的转行者，在初次接触微信小程序开发时，往往会被市面上五花八门的框架卡住。有人让你写原生语法，有人推荐用类 Vue 的开发模式，还有人坚持用 React 风格的跨端框架。这门课解决的核心场景就是“框架选型迷茫”与“多框架基础认知”。它把 Mina、Wepy、Mpvue 和 Taro 这四种主流框架放在同一个维度里进行横向拆解。学这门课的意义不在于让你精通所有框架，而是让你明白不同框架在视图层绑定、组件化开发上的语法差异与底层逻辑。当你所在团队需要从零搭建一个小程序项目，或者面临旧项目重构时，你能根据团队技术栈和业务特性，做出合理的技术选型，而不是盲目跟风。

适合什么基础与资料配合建议

这门课不适合零基础小白，它默认你已经掌握 HTML、CSS、JavaScript 基础，最好对 Vue 或 React 有初步了解。资料包里的内容是典型的理论结合实战结构。建议你在使用时，先跳过各框架的初始介绍，直接从第一个框架的“开发环境准备”和“我的第一个微信小程序”看起，跟着配置好微信开发者工具。随后重点研读“视图层-数据绑定”和“列表渲染”这几块，这是理解所有小程序框架运作机制的钥匙。资料里包含一个美团项目的目录结构拆解，建议不要只看文档，要在本地把基础脚手架跑起来，边看资料边在编辑器里修改 rpx 样式和 bindtap 事件，通过真实的数据回显来验证不同框架的编译差异。

学完能独立做什么

当你完整顺完这几个框架的特性后，你能够独立完成一个标准小程序的页面搭建与基础交互。具体来说，你能熟练运用 view、text、image 等基础标签进行页面布局，掌握全局配置与页面配置的优先级逻辑，并利用 setData 或响应式语法完成视图与数据的双向联动。在遇到多页面跳转和列表渲染需求时，你能独立编写逻辑，并具备封装自定义组件的能力。更重要的是，基于资料中提供的美团项目结构分析，你能掌握复杂业务小程序的工程化目录划分思路，从而在实际工作中，独立接手并开发类似电商展示、团购列表等中等复杂度的业务模块，不再对小程序的开发模式感到陌生。


主要介绍当下主流好用的4个微信小程序开发框架：Mina框架、Wepy框架、Mpvue框架和Taro框架，让学习者在同一平面上体验不同的小程序框架开发特点，加深对

课程目录

*   第一章 微信小程序/快应用开发框架精讲/

  *   Mina框架/

    *   课程介绍

    *   小程序的介绍

    *   开发环境的准备

    *   我的第一个微信小程序

    *   微信开发者工具介绍

    *   mina框架的介绍

    *   全局配置文件-window

    *   全局配置文件-tabBar

    *   MINA09-页面配置

    *   视图层-数据绑定1

    *   视图层-数据绑定2

    *   视图层-运算

    *   视图层-列表渲染

    *   视图层-rpx

    *   视图层-样式导入和全局样式

    *   View标签

    *   Text标签

    *   Image标签

    *   Swiper标签

    *   Navigate标签

    *   bindtap和this.setData

    *   自定义组件

    *   美团项目介绍

    *   美团项目文件目录介绍

    *   美团头部

    *   获取地理位置

    *   轮播图

    *   首页导航

    *   签到

    *   好货拼团

    *   广告组

    *   猜你喜欢1

    *   猜你喜欢2

  *   Mpvue框架/

    *   Mpvue介绍

    *   启动项目

    *   项目结构描述

    *   Mpvue的生命周期

    *   标签映射

    *   数据绑定

    *   computed和watch

    *   v-if和v-show

    *   列表渲染

    *   Class动态绑定

    *   Style动态绑定

    *   事件

    *   事件的坑

    *   组件的基本使用

    *   组件传值props

    *   事件总线

    *   总结

  *   Taro框架/

    *   Taro介绍

    *   创建项目

    *   项目结构描述和编码规范

    *   全局配置

    *   页面配置

    *   路由功能

    *   设计稿以及尺寸单位

    *   Taro中的jsx规范

    *   Taro自定义组件

    *   jsx表达式

    *   props属性

    *   props其他介绍

    *   state初体验

    *   props和state结合使用

    *   state的补充

    *   事件的绑定

    *   阻止事件冒泡

    *   事件传递参数

    *   事件传递1

    *   事件的传递2

    *   条件渲染-if

    *   条件渲染-&&-三元运算符

    *   列表渲染

    *   children

    *   组合

    *   外部类

    *   全局样式类

    *   Taro补充和总结

    *   项目介绍和搭建

    *   引入项目资源

    *   位置搜索1

    *   位置搜索2

    *   轮播图

    *   首页菜单

    *   首页拼团

    *   奖励&广告组

    *   猜你喜欢1

    *   猜你喜欢2-动态计算距离

  *   Wepy框架/

    *   课程介绍

    *   快速搭建项目

    *   小程序开发者工具配置

    *   代码高亮配置

    *   开启promise

    *   小程序和wepy文件结构对比

    *   app.wpy中的style

    *   app.wpy中的script

    *   index.wpy中的data和methods

    *   异步中修改数据

    *   计算属性computed

    *   监控属性watch

    *   自定义数据和函数

    *   自定义组件的初步使用

    *   props-静态传值

    *   props-单向绑定

    *   props-双向绑定

    *   父子通信broadcast

    *   子向父通信-emit

    *   组件之间的通信-invoke

    *   冒泡型事件

    *   捕获型事件

    *   用户自定义事件

    *   插槽

    *   拦截器

    *   循环标签repeat

    *   项目介绍

    *   项目搭建

    *   location的静态结构

    *   动态获取地理位置信息

    *   轮播图

    *   首页导航

    *   好货拼团

    *   广告组

    *   商店1

    *   商店2

    *   商店3

    *   调用腾讯地图计算真实距离