| 依赖环境安装 |
Nodejs + VSCode + 命令行工具 - 实战环境准备 |
| Ionic CLI 使用 |
• npm install -g @ionic/cli native-run cordova-res
• ionic start 的参数说明
• ionic serve 的参数说明
• ionic cordova build 的参数说明
• ionic cordova run 的参数说明
• ionic cordova emulate 的参数说明
|
| Ionic 基础实战 |
• Ionic v6 版本（支持 Angular 12+ ）
-安装 v6 版本
-npm install @ionic/angular@6
-安装 angular-server
-npm install @ionic/angular-server@6
-核心包 @ionic/core 的讲解
• Ionic 目录结构和核心文件分析
• Ionic 生命周期实战
-ionViewWillEnter/ionViewDidEnter
-ionViewWillLeave/ionViewDidLeave |
| Ionic 组件实战案例 |
• 菜单导航案例实战
-包含了多个组件：
-ion-grid/ion-col/ion-row
-ion-header/ion-footer
-ion-toolbar
-ion-back-button/ion-buttons/ion-title/ion-content/ion-icon |
• 登录表单案例实战
-包含了多个组件：
-ion-input/ion-textarea
-ion-checkbox/ion-radio
-ion-select
-ion-modal
-日期类 ion-datetime/ion-picker
|
• 轮播组件案例实战
-ion-slide |
• 下拉刷新案例实战
-ion-app
-ion-list
-ion-infinite-scroll
-ion-infinite-scroll-content
-事件 ionInfinite |
| Ionic 请求数据实战案例 |
如何封装一个全局的请求方法
|
| Ionic 路由实战案例 |
• ion-route-redirect 登录跳转拦截 - 案例实战
• 核心组件使用： ion-router/ion-router-link/ion-router-outlet/ion-route
• 核心路由事件： ionRouteDidChange VS ionRouteWillChange
• 核心路由方法： back VS push
|
| Ionic Native 案例 |
• 热更新案例
• 文件选择案例
• 原生设备号等案例 |
| 工具开发 |
• VSCode 插件 Ionic 实战使用
• VSCode 插件 Ionic Snippets 实战使用 |
• Android 打包实战
-jdk 安装 + android studio 安装
-升级，报名，图标等配置
-CI/CD pipeline
-usb 调试
-编译慢的优化方案
-App 签名与签名证书认证
-响应式机型适配 |
• iOS 打包实战
-xcode 安装 + 环境配置
-升级，包名，图标等配置
-上传 appstore 等
-CI/CD pipeline
-编译慢的优化方案
-App 签名与签名证书认证
-响应式机型适配 |
