国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

【微信小程序】采坑之scroll-view組件

張憲坤 / 2331人閱讀

摘要:使用中文類的組件時候也就是需要呈現中文的組件,不限于組件是會自動換行的,這時候需求在中強制不換行。在使用非中文組件時候就一切正常。至于為啥使用中文組件會有一部分留白,這個我不知道是個例還是,反正只需要用相對定位移一下就可以了。

?

一、摘要

  今天在使用scroll-view組件的時候發現結果跟預想的不一樣。其實也不是第一次用了,同樣的寫法卻出現了意料之外的效果,所以認定是bug了。博主使用的是2.3.0版本,所以之前的版本應該也會有這個bug。

二、正文

  先上圖

  這是在scroll-view中添加這么些text組件的時候的效果,代碼我就不上了。發現文本組件莫名其妙的被擠下來了一些,我可是沒有設置上邊距的,而且留白的地方也沒有任何東西。

  經過我苦思冥想以及各種嘗試發現把中文換成英文或者數字,結果就不一樣了。忘記說了,這個scroll-view設置的是x方向滑動。

  可以發現這次超出的部分沒有自動換行了,而且可以左右滑動了,但是留白部分依然存在。

  我現在的需求是需要用中文,而要能滑動。之前導致無法滑動的原因是由于文本自動換行造成的。例如第三個text的“文本組件”這四個字竟然被分到兩行,然后去控制臺看布局的時候發現是這樣的。

  厲害了,這文本組件竟然變成這樣,更奇怪的是還沒有影響其它兄弟組件的布局。

  咋整吶?抱著試一試的心態,我在scroll-view的樣式中添加了這么一行代碼。

white-space: nowrap;

  奇跡出現了,看下面的效果。

  這是我向右邊拖動了一點點的效果。相信大家也能看懂上面那行css吧,就是強制不換行的意思。我猜測官方是用div去實現這個scroll-view的,而且沒有設置這條屬性,所以默認就是自動換行了。

  我們再來看下下面這個scroll-view的使用。

  大家可能跟我一樣很奇怪,為啥這個就可以正常滑動吶。這里面我是沒有強制不換行的。比較一些這兩者的區別就知道為啥了。因為下面這個scroll-view中使用了圖片,圖片的寬度遠遠大于文字。而且我把圖片和文字放在了一個view中,所以整個view的寬度以圖片為主。

三、總結

  scroll-view中的元素大致分為兩類,一類是中文,一類是非中文。使用中文類的組件時候(也就是需要呈現中文的組件,不限于text組件)是會自動換行的,這時候需求在css中強制不換行。在使用非中文組件時候就一切正常。

  至于為啥使用中文組件會有一部分留白,這個我不知道是個例還是bug,反正只需要用相對定位移一下就可以了。雖然這不是最好的解決方案,但是目前也沒有更好的選擇。

?

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/1798.html

相關文章

  • 程序采坑

    摘要:小程序采坑記上手小程序兩個月,多多少少遇到一些坑,在此簡單地作下總結。但一些人可能會遇過這種情況已知小程序組件默認高度,如果子元素高度過高,不會自適應高度。但實際上真是這樣嗎其實小程序的組件表現挺奇怪的。擅長微信小程序開發,系統管理后臺。 小程序采坑記 上手小程序兩個月,多多少少遇到一些坑,在此簡單地作下總結。希望能對那些跟我一樣有遇到過同樣問題的人提供一點幫助,避免掉進這些坑,少走一...

    miya 評論0 收藏0
  • 信小程序坑之wx.miniProgram.postMessage

    摘要:也就是只有在小程序后退組件銷毀分享時才會觸發所以應該改變的時機,調換順序就可以了獲取成功這樣再試試,發現能正常捕獲消息了 工作中有個需求是小程序的網頁在關閉的時候,需要回傳給小程序一個參數 查閱小程序官方文檔,有這樣一個接口 wx.miniProgram.postMessage ,可以用來從網頁向小程序發送消息,然后通過 bindmessage 事件來監聽消息,如下是官方文檔描述 sh...

    sorra 評論0 收藏0
  • 信小程序scroll-view的flex布局問題

    摘要:關于微信小程序的組件,第一次寫的時候是直接在中用了一層容器包裹子元素,然后用了布局,并且是用了組件來實現的橫向滾動,后面有提出改進,但是不記錄下,就發現過了幾天,就有點懵了效果圖在里加一層容器,使用布局實現這里用布局實現的話,就要用組 關于微信小程序的scroll-view組件,第一次寫的時候是直接在scroll-view中用了一層容器包裹子元素,然后用了flex布局,并且是用了組件來...

    nihao 評論0 收藏0
  • 信小程序之選項卡

    摘要:我們在函數中通過獲取設備的寬高來設置組件高度以及高度為導航欄的高度點擊導航欄切換內容點擊切換滑動內容切換導航欄滑動切換可滾動區域滾動最底刷新數據頁面上拉觸底事件的處理函數更新列表一個漂亮的選項卡就完成了完整案例 選項卡隨處可見,微信小程序中也不例外,下面來寫一個簡單的小程序選項卡 思路 之前寫過基于swiper的選項卡,在小程序中有swiper組件,毫無疑問這里要用到swiper組件...

    stormjun 評論0 收藏0
  • 信小程序——商城篇

    摘要:微信小程序之跳轉在進入商品詳情頁以后,點擊左下角的圖標原應該跳轉到首頁,但是一直點也不跳,而且也不報錯。放下效果圖微信小程序購物車購物車頁面邏輯的話,要按業務需求來。 前言 隨著wepy和mpvue的出現及流行,開發小程序變的越來越便捷和強大,作為基佬社區的一份子,我們都需要把自己遇到的問題以及如何解決的方式相互分享,這樣才能幫助到更多的朋(ji)友(lao)。如有寫的不足的地方,請各...

    k00baa 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<