獲得字符串包含?，渲染到頁面不換行的解決辦法

jemygraw 發布于2019-08-21 11:49 / 2383人閱讀

從接口得到的數據格式是這樣的：

在瀏覽器中log的結果是這樣的：

而想要的結果應該是和log的結果一樣，是這樣的：

但結果直接渲染出來卻是這樣的：

字符“?”是換行的意思，但在前端展示的只是空格，從字符串中indexOf（“?”）得到的是：

并沒有得到“?”。
但是我們indexOf（“ ”）得到：

所以可以由此入手：

let arr = name.split("
")
    const arrItems = arr.map((item)=>{
              {item}
          })

就可以得到我們想要的效果：

云服務器 GPU云服務器 js每十個換行的算法文字不換行數據不換行 htmldiv不換行

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

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

使用 <wbr> 解決長 URL 的換行問題

摘要：開發中，屏幕寬度有限，超長文字必須換行。嘗試原生方法無法解決問題，只好摸索手動斷行的做法。用解決這個問題困擾了我很久，直到前兩天，我突然發現原來有軟換行的存在。本案例中，使用實際上是想借用瀏覽器計算表格各列寬度的機制。問題我們知道，世界上文字主要有兩種：一種是以中文為代表的象形文字；另一種是以英法俄等為代表的拼音語系。前者的換行很簡單，每個單字都有自己的意義，所以每個字后面都可以換...

104828720 2019-08-30 11:02 評論0 收藏0
使用 <wbr> 解決長 URL 的換行問題

摘要：開發中，屏幕寬度有限，超長文字必須換行。嘗試原生方法無法解決問題，只好摸索手動斷行的做法。用解決這個問題困擾了我很久，直到前兩天，我突然發現原來有軟換行的存在。本案例中，使用實際上是想借用瀏覽器計算表格各列寬度的機制。問題我們知道，世界上文字主要有兩種：一種是以中文為代表的象形文字；另一種是以英法俄等為代表的拼音語系。前者的換行很簡單，每個單字都有自己的意義，所以每個字后面都可以換...

lily_wang 2019-08-02 15:12 評論0 收藏0
CSS3 文本換行

摘要：文本換行其實是個非常常用但并不起眼的特性。在中日韓文情況下，和有區別，見下圖中日韓文情況下，仍舊等于沒有設，瀏覽器選擇在文字或標點符號處換行。但設成后，將不再允許斷詞哪怕是中日韓文，只能像英語系一樣根據半角空格或標點來換行。文本換行其實是個非常常用但并不起眼的特性。你什么都不用設，瀏覽器自動就會換行。例如英語，瀏覽器會根據容器尺寸，選擇在半角空格或連字符處換行。例如中文，瀏覽器會選擇...

EasonTyler 2019-08-30 13:16 評論0 收藏0
CSS3 文本換行

摘要：文本換行其實是個非常常用但并不起眼的特性。在中日韓文情況下，和有區別，見下圖中日韓文情況下，仍舊等于沒有設，瀏覽器選擇在文字或標點符號處換行。但設成后，將不再允許斷詞哪怕是中日韓文，只能像英語系一樣根據半角空格或標點來換行。文本換行其實是個非常常用但并不起眼的特性。你什么都不用設，瀏覽器自動就會換行。例如英語，瀏覽器會根據容器尺寸，選擇在半角空格或連字符處換行。例如中文，瀏覽器會選擇...

chinafgj 2019-08-01 16:05 評論0 收藏0
【CSS】小妙招，各種問題總結方法處理

摘要：應用常例是屬性設置水平放置后出現間隙。邊框產生的位置只有兩個地方，在內容內，在內容外，請看下面介紹。產生在內容外，這個好理解，也是我們最普遍見到的，就是在內容外繪制邊框。1.實現div文字溢出自動省略號截取 ? overflow:hidden;??/*超過部分不顯示*/??　　　　　　text-overflow:ellipsis;??/*超過部分用點點表示*/??　　　...

springDevBird 2019-04-23 13:28 評論0 收藏0