在es6模板文字,如何包装一个长模板文字到多行而不创建一个新的行在字符串?
例如,如果你这样做:
const text = `a very long string that just continues
and continues and continues`
然后它将为字符串创建一个新的行符号,就像解释它有一个新的行一样。如何在不创建换行符的情况下将长模板文字包装到多行?
在es6模板文字,如何包装一个长模板文字到多行而不创建一个新的行在字符串?
例如,如果你这样做:
const text = `a very long string that just continues
and continues and continues`
然后它将为字符串创建一个新的行符号,就像解释它有一个新的行一样。如何在不创建换行符的情况下将长模板文字包装到多行?
当前回答
我有点晚了,但对于未来任何关于这个问题的访问,我发现这个方法最适合我的用例。
我正在运行一个Node.js服务器,并希望以字符串格式返回html,这就是我解决它的方法:
我的响应对象:
const httpResponse = {
message: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ultrices et odio eget blandit. Donec non tellus diam. Duis massa augue, cursus a ornare vel, pharetra ac turpis.',
html: `
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<p>Praesent ultrices et odio eget blandit.</p>
<ul>
<li>Donec non tellus diam</li>
<li>Duis massa augue</li>
</ul>
`,
}
当发送http请求时,这将转换为以下内容:
{
"message": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ultrices et odio eget blandit. Donec non tellus diam. Duis massa augue, cursus a ornare vel, pharetra ac turpis.",
"html": "\n\t\t<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>\n\t\t<p>Praesent ultrices et odio eget blandit.</p>\n\t\t<ul>\n\t\t\t<li>Donec non tellus diam</li>\n\t\t\t<li>Duis massa augue</li>\n\t\t</ul>\n\t"
}
这当然很难看,也很难处理。所以在我发送http之前,我修剪字符串的每一行。
httpResponse.html = httpResponse.html.split('\n').map(line => line.trim()).join('')
这是这一行简单代码之后的结果。
{
"message": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ultrices et odio eget blandit. Donec non tellus diam. Duis massa augue, cursus a ornare vel, pharetra ac turpis.",
"html": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p><p>Praesent ultrices et odio eget blandit.</p><ul><li>Donec non tellus diam</li><li>Duis massa augue</li></ul>"
}
其他回答
另一种选择是使用Array。像这样加入:
[
'This is a very long string. ',
'It just keeps going ',
'and going ',
'and going ',
'and going ',
'and going ',
'and going ',
'and going',
].join('')
如果你的问题是相反的,你需要保留换行符,但由于某种原因,它们不被尊重,只需在文本容器中添加css属性:
#yourTextContainer {
white-space: pre-line;
}
你可以直接吃掉模板文字中的换行符。
//感谢https://twitter.com/awbjs给我介绍这个想法 //这里:https://esdiscuss.org/topic/multiline-template-strings-that-don-t-break-indentation const printLongLine = continue => { Const text = '一个很长的字符串,只有${continues}${" }和${continuations}和${continuations} '; 返回文本; } console.log (printLongLine('继续'));
这个NPM包允许你做以下事情…
import { oneLine } from 'common-tags';
const foo = oneLine`foo
bar
baz`;
console.log(foo); // foo bar baz
类似于Doug的回答,这被我的TSLint配置所接受,并且不受我的IntelliJ自动格式化器的影响:
const text = `a very long string that just ${
continues
} and ${continues} and ${continues}`