如何在UI5中向文本添加换行符?

本文介绍了如何在UI5中向文本添加换行符?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

转义字符 \ n 和Unicode字符 \ u000a 仅适用于JavaScript.但是，我试图在XML视图中添加一个换行符，如下所示.但不起作用:

The escape character \n and Unicode character \u000a will only work in JavaScript. However, I'm trying to add a line break in XML view as below. But doesn't work:

<u:TimelineItem text="First Line\n SecondLine" />

推荐答案

文本控件中的新行可以添加以下字符:

New lines in text controls can be added with the following characters:

在XML 视图或XML片段中:
- 换行符:
   或
   .
- 结合回车:
   或
   .
- In XML views or XML fragments:
  - Line feed: 
     or 
    .
  - In combination with carriage return: 
     or 
    .
  - 换行符: \ n 或 \ u000a .
  结合回车: \ r \ n 或 \ u000d \ u000a .
  或者，考虑使用 模板文字 ，而不是手动连接上述字符(即，只需将" ..."替换为 ` ... ` ).
  Alternatively, consider using template literals instead of concatenating the above characters manually (i.e. simply replace "..." with `...`).
  - sap.m.MessageStrip : API参考，示例
  - sap.m.FormattedText : API参考
  - sap.m.MessageStrip since UI5 v1.85: API reference, Sample
  - sap.m.FormattedText: API reference
  另请参见具有不同换行格式的问题.对于大多数Internet协议，建议将其与回车结合使用.
  See also Issues with different newline formats. It is recommended to use the combination with Carriage Return for most of the internet protocols.
  这是一个带有 sap.suite.ui.commons.TimelineItem 和 sap.m.Text 的演示:
  Here is a demo with sap.suite.ui.commons.TimelineItem and sap.m.Text:
```
sap.ui.require([
  "sap/ui/core/Core"
], Core => Core.attachInit(() => sap.ui.require([
  "sap/ui/core/mvc/XMLView",
  "sap/m/Text",
], async (XMLView, Text) => {
  "use strict";

  const view = await XMLView.create({
    definition: `<mvc:View xmlns:mvc="sap.ui.core.mvc" height="100%">
      <App xmlns="sap.m" autoFocus="false">
        <Page showHeader="false" class="sapUiResponsiveContentPadding">
          <commons:TimelineItem xmlns:commons="sap.suite.ui.commons"
            text="Multiline supported&#10;in Timeline items (XML)"
          />
          <HBox id="myBox" justifyContent="SpaceAround">
            <Text
              text="This&#10;is&#x0A;a&#13;&#10;text (created in XML view)!"
              renderWhitespace="true"
            />
          </HBox>
        </Page>
      </App>
    </mvc:View>`,
  });

  const textCreatedInJS = new Text({
    renderWhitespace: true,
    text: "And this\nis\u000aanother\r\ntext (created in JS)!",
  });
  Core.byId(view.createId("myBox")).addItem(textCreatedInJS);
  view.placeAt("content");
})));
```
```
<script id="sap-ui-bootstrap"
  src="https://ui5.sap.com/resources/sap-ui-core.js"
  data-sap-ui-libs="sap.ui.core,sap.m,sap.suite.ui.commons"
  data-sap-ui-theme="sap_fiori_3"
  data-sap-ui-async="true"
  data-sap-ui-compatversion="edge"
  data-sap-ui-excludejquerycompat="true"
  data-sap-ui-xx-waitfortheme="init"
></script>
<body id="content" class="sapUiBody"></body>
```
  如果使用控件 sap.m.Text ，请依次添加 renderWhitespace:true 和 wrapping:true (默认)在DOM中渲染新行.
  In case the control sap.m.Text is used, add renderWhitespace: true together with wrapping: true (default) in order render the new lines in the DOM.
  关于TimelineItem不支持多行:这是SAPUI5中的一个错误，已在1.44.5+版本中修复.
  About the TimelineItem not supporting multiline: that was a bug in SAPUI5 which is fixed with version 1.44.5+.
  
  这篇关于如何在UI5中向文本添加换行符?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

如何在UI5中向文本添加换行符

问题描述

推荐答案

在XML 视图或XML片段中:

In XML views or XML fragments: