今天給各位分享uniapp項目運行到web上樣式錯亂的知識，其中也會對uniapp發(fā)布小程序樣式亂了進行解釋，如果能碰巧解決你現(xiàn)在面臨的問題，別忘了關(guān)注本站，現(xiàn)在開始吧！

本文目錄一覽：

• 1、uni-app運行到H5正常，但運行到小程序不正常、報錯總結(jié)
• 2、uniapppadmimi2頁面樣式加載錯亂
• 3、uniapp安裝vuex后頁面混亂
• 4、uniapp開發(fā)遇到的問題總結(jié)
• 5、uni-app 為什么CSS運行到到手機上就錯位了
• 6、uniapp 為什么嵌入web-view頁面空白

uni-app運行到H5正常，但運行到小程序不正常、報錯總結(jié)

同級多個 v-for 時 key 的值是不允許重復的，key 的綁定是不支持表達式的，需要按照以下方式處理。

控制臺"Cannot read property 'globalData' of undefined"

解決辦法：將getApp()替換成this

以上錯誤的寫法編譯都會不通過

問題應(yīng)該出在(item.title || '').length，其中(item.title || '')得到的結(jié)果有問題

解決辦法：加入in(this)

原因：h5引用組件會渲染成uni-view標簽，而小程序直接是comp-a標簽，此時雖然顯示設(shè)置了樣式，但不會渲染出來

解決辦法：在子組件中設(shè)置好樣式，或者用/deep/ 對子組件下的節(jié)點設(shè)置樣式

解決辦法：在父組件修改對象的數(shù)據(jù)，不要在子組件操作，網(wǎng)上說是微信小程序無法直接操作props里的對象

1.豎向的列表，使用的view的滾動，并設(shè)置overflow-y:scroll;滑動列表然后點擊列表某一項跳轉(zhuǎn)詳情后，再回到列表頁，view總是回到了頂部，和 這個問題 一樣。

解決辦法：

使用scroll-view替換view，設(shè)置scroll-y=true，但也產(chǎn)生了一個問題，scroll-view的寬度默認繼承父級元素的寬度（屏幕寬度），并不是等于所有子集元素的和，因此需要動態(tài)設(shè)置scroll-view的寬度

2.uni設(shè)置scroll-top為0無效

uniapp里面使用scroll-view 組件，動態(tài)設(shè)置scroll-top 屬性來控制滾動高度，但是當想滾動到起始位置時 設(shè)置動態(tài)值為0 時無效的

解決辦法：

首先要定義一個變量記錄滾動條的位置

用 @scroll="scrollChange" 監(jiān)聽 滾動條變化

定義一個變量 存滾動的位置，當需要滾動到 初始值的時候

先將滾動的當前高度賦值給scrollTop 然后設(shè)置為0 就有效果了

uniapppadmimi2頁面樣式加載錯亂

1、首先打開相應(yīng)的代碼文件。

2、其次找到“plus.screen.lockOrientation（‘portrait-primary’）”。

3、最后將代碼并注釋掉即可。

uniapp安裝vuex后頁面混亂

其實就是橫豎屏切換之后的第一個加載的頁面樣式會錯亂，所以需要一個空白的頁面來承載這個樣式錯亂的問題。在橫屏頁面返回時，監(jiān)聽onBackPress()使其跳轉(zhuǎn)到一個空白的vue頁面，這個空白的vue頁面在跳轉(zhuǎn)到自己想去的頁面。這樣這個空白vue頁面會樣式錯亂，但不會影響其他頁面。

uniapp開發(fā)遇到的問題總結(jié)

解決方案：

定義一個布爾類型的變量放到頁面上去，改變循環(huán)的數(shù)據(jù)的某個屬性時，給該變量賦值成false，然后再設(shè)置成true

只能使用create生命周期去構(gòu)造了，如果不能滿足的話就另想其他辦法了

使用 placeholder-class 屬性設(shè)置一個類名，再用該類名寫樣式去覆蓋掉原有的樣式

使用js給img標簽添加行內(nèi)樣式以達到目的

經(jīng)過頑強的詢問，搜索，才知道HBuilderX 2.9.0+ 相關(guān)更新：調(diào)整根字體大小為系統(tǒng)默認大小與微信小程序平臺一致，調(diào)整后 rem 默認大小不再為 窗口寬度/20，改為了瀏覽器（webview）默認的字體大小，一般為 16px

這是社區(qū)給的解決方案： 更新 HBuilderX 2.9.0+ 后 rpx(upx)、rem 樣式變形的處理辦法

我做的項目主要是使用 rpx 的部分變形，使用的解決方案為 寬屏適配指南

在里面找到的解決方案如下：

在 pages.json 的 globeStyle 里配置 rpx 的如下參數(shù)

uni-app 為什么CSS運行到到手機上就錯位了

正常操作，蘋果手機總會出現(xiàn)各種各樣的問題的，可能是不兼容某個屬性，慢慢排查調(diào)整，建議先在微信開發(fā)者工具上測試，比在瀏覽器上的好一點。

uniapp 為什么嵌入web-view頁面空白

搭建了一個項目uni-app項目，嵌入了web-view，按照教程來搭建，src 引入文件和路徑都沒有問題，可是頁面就是出不來，也沒有報錯，最重要的是上百度，什么也查不出來問題。

記錄下解決方案，如果遇到了這個問題的可以試著解決下。

問題：uniapp 嵌入web-view頁面空白。

解決方式：檢查web-view 中src 路徑中，命名是否有問題。正常的路徑應(yīng)該是 hybird/html /page路徑

重要的是 /hybird/html/ 這個路徑是固定寫法，不能修改，我就是將html 這個文件夾改了名字，導致web-view 怎么也顯示不出來。

官方解釋：

關(guān)于uniapp項目運行到web上樣式錯亂和uniapp發(fā)布小程序樣式亂了的介紹到此就結(jié)束了，不知道你從中找到你需要的信息了嗎 ？如果你還想了解更多這方面的信息，記得收藏關(guān)注本站。