一个用于条件构造HTML属性字符串的PHP实用工具。

v1.0.0 2024-08-14 14:18 UTC

This package is auto-updated.

Last update: 2024-09-15 08:11:00 UTC


README

一个用于条件构造HTML属性字符串的PHP实用工具。

注意

本包适用于PHP。如果您在寻找JavaScript/React.js,请查看原始的 lukeed/clsx

本包受 lukeed/clsx 的启发,旨在为PHP提供类似的功能,并额外提供在一个函数调用中合并所有属性的功能。

安装

composer require dobaniashish/clsx

用法

本包提供三个函数

  • Clsx::attrs - 生成完整的属性字符串。
  • Clsx::value - 生成属性值字符串。
  • Clsx::merge - 合并两个属性数组。

函数 Clsx::attrs()

返回生成的完整属性字符串。

参数

  • $attrs_array (array) 属性数组。

用法

use Dobaniashish\Clsx\Clsx;

// String values.
Clsx::attrs(['foo' => 'bar', 'baz' => 'qux']);
//=> 'foo="bar" baz="qux"'

// Arrays values.
Clsx::attrs(['foo' => 'bar', 'baz' => ['qux', 'quux']]);
//=> 'foo="bar" baz="qux quux"'

// Arrays values with conditions.
Clsx::attrs([
	'foo' => 'bar',
	'baz' => [
		'qux' => true,
		'quux' => false,
	]
]);
//=> 'foo="bar" baz="qux"'

// Attribute names only.
Clsx::attrs(['foo', 'bar']);
//=> 'foo bar'

// Attribute names only with conditions.
Clsx::attrs(['foo' => true, 'bar' => false]);
//=> 'foo=""'

// Arrays values with all falsy conditions.
Clsx::attrs([
	'foo' => 'bar',
	'baz' => [
		'qux' => false,
		'quux' => false,
	]
]);
//=> 'foo="bar"'

// Arrays values with all falsy conditions but keep attribute name.
Clsx::attrs([
	'foo' => 'bar',
	'baz' => Clsx::value([
		'qux' => false,
		'quux' => false,
	]) ?: true
]);
//=> 'foo="bar" baz'

示例

<?php
use Dobaniashish\Clsx\Clsx;

$button_attrs = [
	'id' => 'button-id',
	'class' => [
		'button',
		'button-success' => true,
	],
	"disabled" => false,
];
?>

<button <?php echo Clsx::attrs($button_attrs); ?>>Click!</button>

函数 Clsx::value()

返回生成的属性值字符串。

参数

  • $value_array (array) 属性值数组。

用法

use Dobaniashish\Clsx\Clsx;

// String values.
Clsx::value(['foo', 'bar']);
//=> 'foo bar'

// Arrays value with conditions.
Clsx::value(['foo' => true, 'bar' => true, 'baz' => false]);
//=> 'foo bar'

示例

<?php
use Dobaniashish\Clsx\Clsx;

$button_classes = Clsx::value([
	'button',
	'button-success' => true,
]);
?>

<button class="<?php echo $button_classes; ?>">Click!</button>

函数 Clsx::merge()

返回合并的属性数组。

参数

  • $array1 (array) 属性值数组。
  • $array2 (array) 属性值数组 2。

示例用法

<?php
use Dobaniashish\Clsx\Clsx;

$button_attrs = [
	'id' => 'button-id',
	'class' => [
		'button',
	],
];

$button_attrs = Clsx::merge($button_attrs, [
	'class' => [
		'button-success' => true,
	],
]);
?>

<button <?php echo Clsx::attrs($button_attrs); ?>>Click!</button>

完整用法示例

<?php
use Dobaniashish\Clsx\Clsx;

// Button statuses.
$button_status = 'success';
$button_size = 'large';
$button_disabled = false;
$button_hide_border = true;

// Button attributes array.
$button_attrs = [
	'id' => 'button-id',
	'class' => [
		'button',
		'button-success' => $button_status === 'success',
		'button-danger' => $button_status === 'danger',
		"button-{$button_size}" => !!$button_size,
	],
	"disabled" => $button_disabled,
	"style" => [
		'color: red;',
		'border: none;' => $button_hide_border,
	],
];

// Add directly to array.
$button_attrs['class']['button-danger'] = false;

// Merge new attribute array.
$button_attrs = Clsx::merge($button_attrs, [
	'class' => [
		// Pre process value.
		Clsx::value([
			'button-merged'
		])
	]
]);
?>

<button <?php echo Clsx::attrs($button_attrs); ?>>Click!</button>

输出

<button
  id="button-id"
  class="button button-success button-large button-merged"
  style="color: red; border: none;"
>
  Click!
</button>

转义

属性名和值不会自动转义。您必须手动转义它们。

Clsx::attrs([
	esc_name('foo') => esc_value('bar'),
	esc_name('baz') => esc_value(Clsx::value([
		'qux' => false,
		'quux' => false,
	])) ?: true
]);

许可证

MIT © DobaniAshish