Skip to content

9. Ionic基础.md

Latest commit

 

History

History
121 lines (86 loc) · 1.42 KB

9. Ionic基础.md

File metadata and controls

121 lines (86 loc) · 1.42 KB

ionic基础

⭐ by calidion

WRITE ONCE. DEPLOY ANYWHERE.

ionic是一个全平台成熟的移动框架

支持多个平台（移动，桌面）

移动端（ios, android, wp)

桌面 (Chrome, Electron)

四大部分

  1. UI组件 重要可视的组件的使用示例

  2. API 所有组件的使用与参数说明

  3. 原生接口(Native) 只有原生平台才会使用到的API或者组件。 至少支持一个平台以上 通常都支持ios/android

  4. 自定义风格(Theming) 基于SASS

快速上手

安装 ionic

npm install -g ionic

安装 cordova

npm install -g cordova

创建

  1. 空项目
ionic start myApp blank
  1. tabs
ionic start myApp tabs
  1. 侧边栏
ionic start myApp sidemenu

ionic代码基础

  1. Angular bootstrap IonicApp IonicModule
  2. PWA prepared

使用到的angular知识点

  1. 模板的

a. 属性绑定：<ion-menu [content]="content"> b. #id: 模板引用变量，相当于在模板中定义了一个变量。

  1. 修饰符的 a. @ViewChild: 获取子元素的信息到类里，方便调用

UI组件

  1. icons a. 使用ionic icons b. 使用fontawsome

  2. sidemenu

  3. tabs

API

  1. AlertController
  2. Chip
  3. InfiniteScroll
  4. Scroll