微信小程序轉 Taro
自
v1.2.0開始支持此功能
Taro 可以將你的原生微信小程序應用轉換為 Taro 代碼，進而你可以通過 taro build 的命令將 Taro 代碼轉換為對應平台的代碼，或者對轉換后的 Taro 代碼進行用 React 的方式進行二次開發。
微信原生小程序轉 Taro 的操作非常簡單，首先必須安裝使用 npm i -g @tarojs/cli 安裝 Taro 命令行工具，其次在命令行中定位到小程序項目的根目錄，根目錄中運行：
$ taro convert
即可完成轉換。轉換后的代碼保存在根目錄下的 taroConvert 文件夾下。你需要定位到 taroConvert 目錄執行 npm install 命令之后就可以使用 taro build 命令編譯到對應平台的代碼。
具體案例件官方案例https://taro-docs.jd.com/taro/docs/taroize.html
轉換完成后需要注意一下幾點：
1. 樣式問題：
在scss文件里，像素單位為px，但是這個值指的是rpx也就是說750px編譯成小程序也就是750rpx，但是如果在行內樣式就不一樣rpx是rpx，px是px，但是h5不支持rpx，因此這里就出現了Taro.pxTransform(750)這個轉換方法，只要是動態在行內樣式都需要
2. 頁面傳參數：
這里不在是options了，現在是this.$route.params 相當於是小程序里的 onload里的options
3. Image標簽問題：
小程序的Image轉換到h5,taro的組件Image，你在頁面查看元素會發現img外面套了一個div還自帶了小程序image的樣式，這里最臟了需要自己手動修改taro-image的width
4. app.js
taro會給app自帶config屬性，所以建議之前在app加了config屬性的統一一件改成conf或者自定義
5. swiper組件的坑：
轉換后查看swiper，因為swiper的第一個子元素必須是swiperItem
6. 所有授權（獲取用戶信息，獲取手機號碼等）的button按鈕：
所有授權（獲取用戶信息，獲取手機號碼等）的button按鈕都需要寫兩套代碼，因為h5不支持onGetUserInfo，onSubmit， open-type="getUserInfo" formType="submit" 等屬性，如果寫了h5是會刷新頁面的
這里說一下使用taro-ui，需要配置config文件下的h5屬性如下
7. async:
Taro 支持使用 async functions 來讓開發者獲得不錯的異步編程體驗，開啟 async functions 支持需要安裝包 @tarojs/async-await
$ yarn add @tarojs/async-await # 或者使用 npm $ npm install --save @tarojs/async-await 隨后在項目入口文件 app.js 中直接 import ，就可以開始使用 async functions 功能了
// src/app.js import '@tarojs/async-await' 值得注意的事，使用
@tarojs/async-await一定要記得按照開發前注意中提示的內容進行操作，否則會出現報錯
8. block標簽：
block標簽轉換會變成 div ，這樣會影響flex布局
9. 綁定事件:
綁定事件都需要手動指向this（即添加.bind(this)）
現總結到這，之后慢慢捋一捋思緒，歡迎大家來探討。
————————————————————————————————————————————————
版權歸本網站的作者所有，轉載請注明出處，謝謝大家。