woocommerce/packages/js/explat/zh-cn/README.md
2026-04-15 10:18:01 +08:00

1.6 KiB
Raw Permalink Blame History

ExPlat

此包包含一个组件和实用函数,可用于在 WooCommerce 仪表板、报告页面和前端页面中运行 A/B 测试。

安装

安装模块

pnpm install @woocommerce/explat --save

此包假定您的代码将在 ES2015+ 环境中运行。如果您使用的环境对 ES2015+ 支持有限或没有支持(例如较低版本的 IE那么使用 core-js 或 @babel/polyfill 将添加对这些方法的支持。在 Babel 文档中了解更多信息。

使用实验组件

import { Experiment } from '@woocommerce/explat';

const DefaultExperience = <div>Hello World</div>;

const TreatmentExperience = <div>Hello WooCommerce!</div>;

const LoadingExperience = <div></div>;

<Experiment
	name="woocommerce_example_experiment"
	defaultExperience={ DefaultExperience }
	treatmentExperience={ TreatmentExperience }
	loadingExperience={ LoadingExperience }
/>;

// 以 WPCOM 用户身份认证获取实验作业。
import { ExperimentWithAuth } from '@woocommerce/explat';

<ExperimentWithAuth
	name="woocommerce_example_experiment"
	defaultExperience={ DefaultExperience }
	treatmentExperience={ TreatmentExperience }
	loadingExperience={ LoadingExperience }
/>;

使用 useExperiment

import { useExperiment } from '@woocommerce/explat';

const DefaultExperience = <div>Hello World</div>;

const TreatmentExperience = <div>Hello WooCommerce!</div>;

const [ isLoadingExperiment, experimentAssignment ] = useExperiment('experiment-name');

if ( ! isLoadingExperiment && experimentAssignment?.variationName === 'treatment' ) {
	return <TreatmentExperience />
}

return <DefaultExperience />