使用回退样式

用法

import { withFallbackStyles, Button } from '@wordpress/components';

const { getComputedStyle } = window;

const MyComponentWithFallbackStyles = withFallbackStyles(
    ( node, ownProps ) => {
        const buttonNode = node.querySelector( 'button' );
        return {
            fallbackBackgroundColor: getComputedStyle( buttonNode )
                .backgroundColor,
            fallbackTextColor: getComputedStyle( buttonNode ).color,
        };
    }
)( ( { fallbackTextColor, fallbackBackgroundColor } ) => (
    <div>
        <Button variant="primary">我的按钮</Button>
        <div>文本颜色：{ fallbackTextColor }</div>
        <div>背景颜色：{ fallbackBackgroundColor }</div>
    </div>
) );