初識Taro跨多端架構

Taro架構應運而生

• 2018年由京東-凹凸實驗室打造的一套遵循React文法規範的多端統一開發架構。
• 目的：消滅安卓和ios的分歧，把微信作為入口，寫一套代碼在多端運作，消滅跨平台。

Taro安裝

• 腳手架打包成不同的端：

  @tarojs/cli

• 使用npm和yarn全局安裝，或者直接使用npx

• npm install -g @tarojs/cli

• yarn global add @tarojs/cli

建立項目

• taro init app

Dev環境啟動

• web：

  npm run dev:h5

• 微信小程式：

  npm run dev:weapp

• 百度小程式：

  npm run dev:swan

• 支付寶小程式：

  npm run dev:alipay

基于state的資料管理

• 狀态更新是異步的
• 設定狀态一定要用setState
• 同步更新需要傳入callBack

Props傳值

• 自定義元件中接收的來自父元件的傳值統稱為Props
• Props是隻讀的
• 當傳值Props的值是函數時，必須用on+函數名的規範來命名

Taro生命周期

• H5和小程式有差别
• React架構中的生命周期函數被保留
• 新增支援小程式的幾個生命周期
• 小程式區分頁面群組件，React全認為是元件

文法規範

• React文法規範
• 支援JSX文法
• 适配小程式，部分文法不支援