Taro + React + Tailwind 開發微信小程序問題匯總(持續更新中...)

搞小程序也有兩周了,踩了很多坑,有些問題很難搜索到,在這里記錄一下問題和自己的解決方案,希望能幫助到需要的小伙伴~

1. 真機調試報錯:Error: module ‘@babel/runtime/helpers/Arrayincludes.js’ is not defined

  • 真機調試模式從 2.0 切換為 1.0 即可解決
  • 要將【轉換為 ES5】勾選掉,因為 Taro 通過 webpack 已經將代碼編譯為 ES5。

2. Taro 中如何使用 weui?

// app.config.ts 
useExtendedLib: { weui: true, }, 
usingComponents: { 'mp-badge': 'weui-miniprogram/badge/badge'...},

3. Taro 動態設置當前頁面的標題

  • Taro.setNavigationBarTitle(option)
  • 文檔:https://docs.taro.zone/docs/apis/ui/navigation-bar/setNavigationBarTitle

4. app.js錯誤: Error: module ‘common.js’ is not defined, require args is './common’

  • 偶現,可以先重啟 webpack

5. 小程序樣式不生效,tailwind 偽類不生效(hover)

  • 因為 標簽要單獨配置 hoverClass
  • 文檔:https://docs.taro.zone/docs/components/viewContainer/view

6. Error: module ‘vendors.js’ is not defined

  • 刪掉 node_modules 重裝

7. fail api scope is not declared in the privacy agreement

  • 參考:https://developers.weixin.qq.com/community/develop/article/doc/0006e28bddcdd89ff7208d2e06bc13

8. taro 中配置的 global.d.ts 引入方式不能使用 import,否則因為在頭部引用會導致整個 ts 配置文件失效!

  • 正確引入方式:/// <reference types="@tarojs/taro" />。因為在頭部錯誤使用 import 引入類型,導致 declare module ‘*.png’ 不生效

9. object-fit 在小程序中不生效

  • 內置了字段可以配置,參考:https://docs.taro.zone/docs/components/media/image

10. Taro 引入 weui <mp-dialog>其中bindbuttontap按鈕點擊事件不生效

  • 需要將 bindbuttontap 改成 onButtontap

11. uploadFile:fail createUploadTask:fail url not in domain list

可能有如下原因:

  • uploadFile 合法域名未配置或配置錯誤
  • 或者是 url 寫錯(仔細檢查一下,我這邊就是 url 傳錯了,忘記添加 baseurl,因為和 get 與 post一起封裝的,但是options沒有共用)

12. Taro 如何實現手勢放縮圖片

  • 注意需要配置 scale 才支持放縮
<MovableArea style='height: 200px; width: 200px; background: red;'><MovableView style='height: 50px; width: 50px; background: blue;' direction='all' scale ></MovableView>
</MovableArea>

13. 小程序使用 <mp-dialog> 時彈窗被鍵盤遮住

  • 配置 input 組件 cursor-spacing 參數,可以指定光標與鍵盤的距離

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/web/11201.shtml
繁體地址,請注明出處:http://hk.pswp.cn/web/11201.shtml
英文地址,請注明出處:http://en.pswp.cn/web/11201.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

Transformers 加速的一些常用技巧

Transformers 是一個強大的架構&#xff0c;但模型因其采用的自注意力機制&#xff0c;雖然能夠有效地處理序列數據并捕獲長距離依賴關系&#xff0c;但同時也容易導致在訓練過程中出現OOM&#xff08;Out of Memory&#xff0c;內存不足&#xff09;或者達到GPU的運行時限制。…

AI大模型探索之路-訓練篇22: ChatGLM3微調實戰-從原理到應用的LoRA技術全解

系列篇章&#x1f4a5; AI大模型探索之路-訓練篇1&#xff1a;大語言模型微調基礎認知 AI大模型探索之路-訓練篇2&#xff1a;大語言模型預訓練基礎認知 AI大模型探索之路-訓練篇3&#xff1a;大語言模型全景解讀 AI大模型探索之路-訓練篇4&#xff1a;大語言模型訓練數據集概…

MPLAB X IDE編譯attiny1616工程報錯卻無報錯信息

MPLAB X IDE(XC-8編譯器)編譯報錯&#xff0c;無具體錯誤內容&#xff0c;僅顯示需要xc-8 pro的警告。 內存占用率顯示為81%&#xff0c;未超標。 原因&#xff1a;軟件使用了microchip的bootloader功能。應用程序起始地址&#xff08;也是bootloader結束地址&#xff09;設置錯…

社交巨頭:探索Facebook的震撼力量

Facebook作為社交媒體領域的巨頭&#xff0c;不僅在數字化社會中占據著重要地位&#xff0c;更是影響了人們的生活、工作和社交方式。本文將深入探索Facebook的震撼力量&#xff0c;從多個角度解讀其在當今社會中的重要性和影響。 1. 全球用戶覆蓋的壯觀規模 Facebook作為全球…

軟件定義汽車七大典型應用場景

隨著軟件定義汽車典型應用場景的落地&#xff0c;用戶將明顯體驗到汽車從交通工具向智能移動終端的轉變。幾十年前主要用高性能的底盤操穩與動力系統定義一臺好車&#xff0c;幾年前主要用智能化系統與智能交互滿足終端用戶的用車體驗&#xff0c;未來將調度全車傳感器與數據驅…

c 數組遍歷

#include <stdio.h> #include <stdlib.h> int main() { printf(“指針數組練習&#xff01;&#xff01;&#xff01;\n”); /* 數組名就是數組的首地址 數組存在一段連續的內存空間中 */ double score[] {60, 70, 80, 90, 100}; double *ptr_score; i…

docker安裝時報錯:Error: Nothing to do

安裝docker時報以下錯誤 解決方法&#xff1a; 1.下載關于docker的相關依賴環境 yum -y install yum-utils device-mapper-persistent-data lvm22.設置下載Docker的鏡像源 yum-config-manager --add-repo http://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo3…

FMEA存在的五個主要不足及改進措施——FMEA軟件

免費試用FMEA軟件-免費版-SunFMEA 在制造業和產品設計領域&#xff0c;失效模式與影響分析&#xff08;Failure Modes and Effects Analysis&#xff0c;簡稱FMEA&#xff09;被廣泛運用&#xff0c;用于預防潛在的設計或制造缺陷。然而&#xff0c;盡管FMEA在風險管理方面發揮…

開發者集結號:大灣區 Open Source Day 邀您共探技術前沿

開源技術正以其開放、協作的特性&#xff0c;引領著軟件開發的新潮流&#xff0c;是推動社會進步的重要力量。作為開發者&#xff0c;您是否渴望深入了解開源項目的前沿動態&#xff1f;由ALC深圳與2024中國互聯網發展創新與投資大賽聯合舉辦、FISCO金鏈盟深度參與的大灣區 Ope…

MySQL————創建存儲過程函數

存儲過程使用大綱 有參數傳遞 delimiter $$ 聲明一個名稱為get_student_introduce create procedure add_student_infor( in p_userName VARCHAR(20),in p_phone VARCHAR(11),in p_sex char(2),in p_introduce VARCHAR(255)) 開始操作 BEGIN 撰寫真正在操作DMLDQL都行 INSE…

CSS---復合選擇器、元素顯示模式和背景(三)

一、CSS的復合選擇器 1.1 什么是復合選擇器 在CSS中&#xff0c;可以根據選擇器的類型把選擇器分為基礎選擇器和復合選擇器&#xff0c;復合選擇器是建立在基礎選擇器之上&#xff0c;對基本選擇器進行組合形成的。 復合選擇器是由兩個或多個基礎選擇器連寫組成&#xff0c;它…

SpringBoot3和SpringBoot2分別整合knife4j(openApi)

文章目錄 一、SpringBoot2進行整合knife4j1.1 導入依賴1.2 配置knife4j 配置文件1.3 可以在接口上配置 注解進行信息的配置 二、SpringBoot3 整合kinfe4j(openApi)2.1 導入依賴2.2 yaml配置文件2.3 swagger初始化配置2.4 創建接口 一、SpringBoot2進行整合knife4j 1.1 導入依賴…

【云原生】kubernetes核心組件

引言&#xff1a; Kubernetes 是為運行分布式集群而建立的&#xff0c;分布式系統的本質使得網絡成為 Kubernetes 的核心和必要組成部分&#xff0c;了解 Kubernetes 網絡模型可以使你能夠正確運行、監控和排查應用程序故障。 一、Kubernetes的核心組件 1.1、Master組件 1.1.…

基于Springboot+Vue的Java項目-農產品直賣平臺系統開發實戰(附演示視頻+源碼+LW)

大家好&#xff01;我是程序員一帆&#xff0c;感謝您閱讀本文&#xff0c;歡迎一鍵三連哦。 &#x1f49e;當前專欄&#xff1a;Java畢業設計 精彩專欄推薦&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb; &#x1f380; Python畢業設計 &am…

Kubernetes之Headless Services

Kubernetes中的Headless Services&#xff08;無頭服務&#xff09;是一種特殊類型的服務&#xff08;Service&#xff09;定義&#xff0c;它不提供傳統意義上的負載均衡和集群IP地址分配。在無頭服務中&#xff0c;spec.clusterIP 字段被顯式設置為None &#xff0c;Kubernet…

可道云teamOS企業網盤實用插件介紹:實時在線流程圖編輯與分享,用在線流程圖打造數字化工作流程

在使用企業網盤用于日常辦公的情況下&#xff0c;有一些實用的在線小工具能為團隊效率和協作帶來一定的提升。 今天要給大家介紹的可道云teamOS的在線畫流程圖&#xff0c;是很值得介紹的一個在線工具。 在線流程圖&#xff1a;直觀展示&#xff0c;高效便捷 以往我們想要梳理…

FANUC機器人單軸零點標定時提示無法執行零點標定,由于重力補償已啟用,所有機器人軸的脈沖計數必須有效

FANUC機器人單軸零點標定時提示無法執行零點標定,由于重力補償已啟用,所有機器人軸的脈沖計數必須有效 首先,機器人由于長時間斷電未使用,6個軸的編碼器數據全部丟失,上電后報警SRVO-062, 有關SRVO-062故障報警的相關內容可參考以下鏈接: FANUC機器人SRVO-062報警原因分…

LeetCode 2391. 收集垃圾的最少總時間

Problem: 2391. 收集垃圾的最少總時間 問題分解 我們將這個問題分解為以下幾個小問題&#xff1a; 計算每種垃圾&#xff08;金屬、紙、玻璃&#xff09;在每個房子中的數量。確定每種垃圾車最后到達的房子。計算每種垃圾車行駛的總時間。計算每種垃圾車收拾垃圾的總時間。返…

SQLite 語法大全

SQLite EXPLAIN 語句&#xff1a; EXPLAIN INSERT statement...; or EXPLAIN QUERY PLAN SELECT statement...; SQLite GLOB 子句&#xff1a; SELECT column1, column2....columnN FROM table_name WHERE column_name GLOB { PATTERN }; SQLite GROUP BY 子句&#xff1…