leaferjs
HTMLText 多个空格只解析出一个空格，如果包含了 这种字符，就加载不出来了
import { Leafer } from 'leafer-ui' import { HTMLText } from 'leafer'
const leafer = new Leafer({ view: window })
const text = new HTMLText({
text: <span style="color: #fff;">输入文本</span>
})
const text1 = new HTMLText({
text: <span style="color: #fff;">输入 文本</span>,
y: 30
})
const text2 = new HTMLText({
text: <span style="color: #fff;">输入 文本</span>,
y: 60
})
leafer.add(text) leafer.add(text1) leafer.add(text2)
用pre标签可以保持原样空格输出。
const text = new HTMLText({
text: '<pre style="color: #fff;">输入 文本</pre>'
})
HTMLText实际是转成SVG图片渲染的，SVG内部使用XML解析规则， nbsp是HTML实体，可以使用XML/Unicode实体 #160或直接使用Unicode字符\u00A0来表示空格。
const text2 = new HTMLText({
text: '<span style="color: #fff;">输入  \u00A0 文本</span>',
y: 60
})
我遇到的问题就是双击HTMLText进行编辑的时候，输入多个空格，然后就自己在那生成了 $nbsp; 然后我们用 tiny 的富文本编辑器编辑内容也是一样，也就是text是不可预料的，也是不可控的，这个时候如果还要我去主动套一个pre，这种工作量是很大的。