微信小程序 Redux Todo 项目教程

微信小程序 Redux Todo 项目教程

1. 项目的目录结构及介绍

wechat-weapp-redux-todos/
├── app.js
├── app.json
├── app.wxss
├── components/
│   ├── add-todo/
│   ├── todo-list/
│   └── todo-item/
├── images/
├── pages/
│   └── index/
├── project.config.json
├── reducers/
│   ├── index.js
│   └── todos.js
├── store/
│   └── configureStore.js
└── utils/
    └── util.js

• app.js, app.json, app.wxss: 小程序的全局配置文件和样式文件。
• components/: 存放小程序的自定义组件。
  • add-todo/: 添加 Todo 的组件。
  • todo-list/: Todo 列表的组件。
  • todo-item/: 单个 Todo 项的组件。
• images/: 存放项目所需的图片资源。
• pages/: 存放小程序的页面。
  • index/: 主页面的文件夹。
• project.config.json: 小程序的项目配置文件。
• reducers/: Redux 的 reducer 文件。
  • index.js: 合并所有 reducer 的主文件。
  • todos.js: 处理 Todo 相关操作的 reducer。
• store/: Redux 的 store 配置文件。
  • configureStore.js: 配置 Redux store 的文件。
• utils/: 存放工具函数。
  • util.js: 项目中使用的工具函数。

2. 项目的启动文件介绍

项目的启动文件主要包括 app.js, app.json, 和 app.wxss。

• app.js: 小程序的入口文件，负责初始化应用实例，引入 Redux store 并绑定到小程序实例上。
• app.json: 小程序的全局配置文件，包括页面路径、窗口表现、网络超时时间等配置。
• app.wxss: 小程序的全局样式文件，定义了全局的样式规则。

3. 项目的配置文件介绍

• app.json: 包含小程序的全局配置，如页面路径、窗口表现、网络超时时间等。
• project.config.json: 小程序的项目配置文件，包含项目名称、AppID、编译设置等。

这些配置文件对于项目的运行和开发至关重要，确保了小程序的正确启动和运行。