富文本

命名空间：core/rich-text。

选择器

getFormatType

按名称返回格式类型。

用法

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>
   ) : (
       __( 'Not Found' )
   ;
};

参数

• state Object：数据状态。
• name string：格式类型名称。

返回

• ?Object：格式类型。

getFormatTypeForBareElement

根据元素的标签名，获取能够处理裸元素（即不带 data-format-type 属性的元素）的格式类型（如果存在）。

用法

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( __( 'Format name: %s' ), format.name ) }</p>;
};

参数

• state Object：数据状态。
• bareElementTagName string：要为其查找格式类型的元素的标签名。

返回

• ?Object：格式类型。

getFormatTypeForClassName

根据元素的类名，获取能够处理该元素的格式类型（如果存在）。

用法

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( __( 'Format name: %s' ), format.name ) }</p>;
};

参数

• state Object：数据状态。
• elementClassName string：要为其查找格式类型的元素的类名。

返回

• ?Object：格式类型。

getFormatTypes

返回所有可用的格式类型。

用法

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>
    ) : (
        __( 'No Formats available' )
    );
};

参数

• state Object：数据状态。

返回

• Array：格式类型列表。

动作

没有可记录的内容。