此功能仍处于实验阶段。“实验性”意味着这是一个早期的实施,可能会发生重大的突破性变化。
文本
是一个核心组件,它使用库的排版系统呈现库中的文本。
文本
可用于呈现任何文本内容,如HTML第页
或跨度
.
从“@wordpress/components”导入{__terialText as Text};函数Example(){return<文本>代码是诗歌</Text>;}
类型:“大型”
,“中等”
,“小”
,“x小”
为呈现文本和Control元素的内容自动计算适当的行高值(例如。文本输入框
).
从“@wordpress/components”导入{__terialText作为文本,TextInput};函数Example(){返回(<Text adjustLineHeightForInnerControls={“small”}>Lorem ipsum悲哀坐amet,奉献<TextInput value=“adipising elit…”/></文本>);}
类型:CSSP属性['textAlign']
调整文本对齐方式。
从“@wordpress/components”导入{__terialText as Text};函数Example(){返回(<Text align=“center”isBlock>Lorem ipsum悲哀坐在amet,神圣的敬拜精英。。。</文本>);}
类型:CSS属性[“颜色”]
调整文本颜色。
类型:CSSProperties[“显示”]
调整CSS显示。
类型:一串
省略号字符串截断
已设置。
类型:“自动”
,“头部”
,“尾巴”
,“中间”
确定截断的位置。例如,我们可以在中间截断文本。为此,我们需要设置省略号模式
到中间的
和一段文字限制
.
汽车
:在末尾自动剪裁内容,不需要限制
.
头
:修剪开头的内容。需要一个限制
.
中间的
:修剪中间的内容。需要一个限制
.
尾
:在末尾修剪内容。需要一个限制
.
类型:布尔值
转义字符突出显示单词
在正则表达式中是有意义的。
类型:布尔值
确定是否高亮显示文字
应区分大小写。
类型:布尔值
搜索词数组。字符串搜索词将自动转换为RegExp,除非突出显示Escape
是真的。
类型:任何[]
内的字母或单词文本
可以使用高亮显示突出显示单词
.
从“@wordpress/components”导入{__terialText as Text};函数Example(){返回(<Text highlightWords={['pi']}>Lorem ipsum悲哀坐在amet,奉献敬爱的精英。Nunc ex公司neque,vulputate a diamet,luctus convallis lacus。前庭acmollis mi.Morbi id elementum massa.莫尔比·伊德·马萨。Suspendisse间隙产生器草履舌。在淡紫色葡萄球菌中酵母erat pellentesque id。</文本>);}
类型:布尔值
集合文本
拥有显示:块
.
注意:文本截断仅在以下情况下有效isBlock(isBlock)
是假
.
类型:布尔值
渲染破坏性颜色。
类型:数
确定以下情况下的最大字符数截断
已设置。
类型:CSS属性['lineHeight']
根据排版系统调整所有文本的行高。
类型:数
将文本内容固定到指定的行数
,添加省略
最后。
类型:CSS属性[“颜色”]
这个文本
可以将颜色调整为背景颜色以获得最佳可读性。优化ReadabilityFor
除了标准CSS颜色值(例如十六进制、RGB、HSL等)之外,还可以接受CSS变量。
从“@wordpress/components”导入{__terialText作为文本,View};函数Example(){const backgroundColor=“蓝色”;返回(<查看css={{backgroundColor}}><文本优化ReadabilityFor={backgroundColor}>Lorem ipsum悲哀坐在amet,奉献敬爱的精英。</文本></视图>);}
类型:CSSProperties[“字体大小”]
,文本大小
根据排版系统调整文本大小。文本
可以呈现各种字体大小,这些字体大小会自动计算并适应排版系统。这个大小
值可以是系统预设值数
,或自定义单位值(一串
)例如3000万
.
从“@wordpress/components”导入{__terialText as Text};函数Example(){return代码是诗歌;}
类型:布尔值
启用文本截断。什么时候?截断
设置后,我们可以用多种方式截断长文本。
注意:如果isBlock(isBlock)
属性设置为真实的
从“@wordpress/components”导入{__terialText as Text};函数Example(){返回(<文本截断>Lorem ipsum悲哀坐在amet,奉献敬爱的精英。Nunc ex公司neque,vulputate a diamet,luctus convallis lacus。前庭acmollis mi.Morbi id elementum massa.莫尔比·伊德·马萨。Suspendisse间隙产生器草履舌。在法雷特拉的莫利斯酵母中酵母erat pellentesque id。</文本>);}
类型:布尔值
将文本内容大写。
类型:“静音”
调整文本的样式变化。
从“@wordpress/components”导入{__terialText as Text};函数Example(){return<文本变体=“静音”>代码为诗歌</文本>;}
类型:CSS属性['fontWeight']
,文本权重
调整文本的字体和宽度。