162 lines
3.4 KiB
Markdown
162 lines
3.4 KiB
Markdown
# 富文本
|
|
|
|
命名空间：`core/rich-text`
|
|
|
|
## 选择器
|
|
|
|
<!-- START TOKEN(Autogenerated selectors|../../../packages/rich-text/src/store/selectors.js) -->
|
|
|
|
### getFormatType
|
|
|
|
通过名称返回格式类型。
|
|
|
|
_使用方法_
|
|
|
|
```js
|
|
import { __, sprintf } from '@wordpress/i18n';
|
|
import { store as richTextStore } from '@wordpress/rich-text';
|
|
import { useSelect } from '@wordpress/data';
|
|
|
|
const ExampleComponent = () => {
|
|
const { getFormatType } = useSelect(
|
|
( select ) => select( richTextStore ),
|
|
[]
|
|
);
|
|
|
|
const boldFormat = getFormatType( 'core/bold' );
|
|
|
|
return boldFormat ? (
|
|
<ul>
|
|
{ Object.entries( boldFormat )?.map( ( [ key, value ] ) => (
|
|
<li>
|
|
{ key } : { value }
|
|
</li>
|
|
) ) }
|
|
</ul>
|
|
) : (
|
|
__( '未找到' )
|
|
;
|
|
};
|
|
```
|
|
|
|
_参数_
|
|
|
|
- _state_ `Object`: 数据状态。
|
|
- _name_ `string`: 格式类型名称。
|
|
|
|
_返回值_
|
|
|
|
- `?Object`: 格式类型。
|
|
|
|
### getFormatTypeForBareElement
|
|
|
|
获取可以处理裸元素（不带 data-format-type 属性）的格式类型（如果有），给定该元素的标签名称。
|
|
|
|
_使用方法_
|
|
|
|
```js
|
|
import { __, sprintf } from '@wordpress/i18n';
|
|
import { store as richTextStore } from '@wordpress/rich-text';
|
|
import { useSelect } from '@wordpress/data';
|
|
|
|
const ExampleComponent = () => {
|
|
const { getFormatTypeForBareElement } = useSelect(
|
|
( select ) => select( richTextStore ),
|
|
[]
|
|
);
|
|
|
|
const format = getFormatTypeForBareElement( 'strong' );
|
|
|
|
return format && <p>{ sprintf( __( '格式名称: %s' ), format.name ) }</p>;
|
|
};
|
|
```
|
|
|
|
_参数_
|
|
|
|
- _state_ `Object`: 数据状态。
|
|
- _bareElementTagName_ `string`: 要查找格式类型的元素的标签名称。
|
|
|
|
_返回值_
|
|
|
|
- `?Object`: 格式类型。
|
|
|
|
### getFormatTypeForClassName
|
|
|
|
获取可以处理元素的格式类型（如果有），给定其类名。
|
|
|
|
_使用方法_
|
|
|
|
```js
|
|
import { __, sprintf } from '@wordpress/i18n';
|
|
import { store as richTextStore } from '@wordpress/rich-text';
|
|
import { useSelect } from '@wordpress/data';
|
|
|
|
const ExampleComponent = () => {
|
|
const { getFormatTypeForClassName } = useSelect(
|
|
( select ) => select( richTextStore ),
|
|
[]
|
|
);
|
|
|
|
const format = getFormatTypeForClassName( 'has-inline-color' );
|
|
|
|
return format && <p>{ sprintf( __( '格式名称: %s' ), format.name ) }</p>;
|
|
};
|
|
```
|
|
|
|
_参数_
|
|
|
|
- _state_ `Object`: 数据状态。
|
|
- _elementClassName_ `string`: 要查找格式类型的元素的类名。
|
|
|
|
_返回值_
|
|
|
|
- `?Object`: 格式类型。
|
|
|
|
### getFormatTypes
|
|
|
|
返回所有可用的格式类型。
|
|
|
|
_使用方法_
|
|
|
|
```js
|
|
import { __, sprintf } from '@wordpress/i18n';
|
|
import { store as richTextStore } from '@wordpress/rich-text';
|
|
import { useSelect } from '@wordpress/data';
|
|
|
|
const ExampleComponent = () => {
|
|
const { getFormatTypes } = useSelect(
|
|
( select ) => select( richTextStore ),
|
|
[]
|
|
);
|
|
|
|
const availableFormats = getFormatTypes();
|
|
|
|
return availableFormats ? (
|
|
<ul>
|
|
{ availableFormats?.map( ( format ) => (
|
|
<li>{ format.name }</li>
|
|
) ) }
|
|
</ul>
|
|
) : (
|
|
__( '无可用格式' )
|
|
);
|
|
};
|
|
```
|
|
|
|
_参数_
|
|
|
|
- _state_ `Object`: 数据状态。
|
|
|
|
_返回值_
|
|
|
|
- `Array`: 格式类型。
|
|
|
|
<!-- END TOKEN(Autogenerated selectors|../../../packages/rich-text/src/store/selectors.js) -->
|
|
|
|
## 操作
|
|
|
|
<!-- START TOKEN(Autogenerated actions|../../../packages/rich-text/src/store/actions.js) -->
|
|
|
|
暂无内容需要记录。
|
|
|
|
<!-- END TOKEN(Autogenerated actions|../../../packages/rich-text/src/store/actions.js) --> |