如何在Typo3 Fluid中正确渲染Mask复选框（处理位掩码）

我之前刚好处理过类似的Mask+TYPO3位掩码渲染场景，分享两种亲测有效的方法给你，都能顺畅实现选中复选框的展示：

首先你要明确：Mask里的每个支付选项对应一个2的n次方位值（第一个选项是1=2^0，第二个是2=2^1，直到第9个256=2^8），我们可以通过位运算判断某个选项是否被选中。

在Fluid模板里，先定义好所有支付选项的掩码与显示文本的对应关系（顺序要和Mask后台配置的选项顺序完全一致），再循环判断渲染：

<f:alias map="{paymentOptions: {
    1: '信用卡',
    2: 'PayPal',
    4: '银行转账',
    8: '现金',
    16: 'Apple Pay',
    32: 'Google Pay',
    64: '支付宝',
    128: '微信支付',
    256: '其他支付方式'
}}">
    <h3>支持的支付方式</h3>
    <ul class="payment-options">
        <f:for each="{paymentOptions}" as="label" key="maskValue">
            <!-- 位运算判断：如果掩码与当前选项值的按位与结果不为0，说明该选项被选中 -->
            <f:if condition="{data.tx_mask_ue_payment_accepted} & {maskValue}">
                <li>
                    <input type="checkbox" checked="checked" disabled="disabled" />
                    <span>{label}</span>
                </li>
            </f:if>
        </f:for>
    </ul>
</f:alias>

这种方法不需要额外写PHP代码，直接在模板里就能完成，适合快速实现单一页面的需求。

如果你的多个模板都需要处理这类位掩码渲染，写个自定义ViewHelper会更优雅，避免重复代码：

第一步：创建ViewHelper类 #

在你的扩展目录下新建文件 EXT:your_extension/Classes/ViewHelpers/RenderMaskCheckboxViewHelper.php，代码如下：

<?php
namespace YourVendor\YourExtension\ViewHelpers;

use TYPO3Fluid\Fluid\Core\ViewHelper\AbstractViewHelper;

class RenderMaskCheckboxViewHelper extends AbstractViewHelper
{
    // 注册参数
    public function initializeArguments()
    {
        $this->registerArgument('mask', 'int', 'Mask返回的整数值', true);
        $this->registerArgument('options', 'array', '选项的掩码值与文本对应数组', true);
        $this->registerArgument('disabled', 'bool', '是否禁用复选框（默认只读）', false, true);
    }

    public function render()
    {
        $mask = $this->arguments['mask'];
        $options = $this->arguments['options'];
        $disabled = $this->arguments['disabled'];

        $output = '<ul class="mask-checkboxes">';
        foreach ($options as $maskValue => $label) {
            if (($mask & $maskValue) !== 0) {
                $checkedAttr = 'checked="checked"';
                $disabledAttr = $disabled ? 'disabled="disabled"' : '';
                $output .= sprintf(
                    '<li><input type="checkbox" %s %s /> %s</li>',
                    $checkedAttr,
                    $disabledAttr,
                    htmlspecialchars($label)
                );
            }
        }
        $output .= '</ul>';

        return $output;
    }
}

第二步：在Fluid模板中调用 #

先声明ViewHelper命名空间，再直接调用：

{namespace vh=YourVendor\YourExtension\ViewHelpers}

<vh:renderMaskCheckbox 
    mask="{data.tx_mask_ue_payment_accepted}" 
    options="{
        1: '信用卡',
        2: 'PayPal',
        4: '银行转账',
        8: '现金',
        16: 'Apple Pay',
        32: 'Google Pay',
        64: '支付宝',
        128: '微信支付',
        256: '其他支付方式'
    }"
/>

• 一定要保证paymentOptions的顺序和Mask后台配置的选项顺序一致，否则位运算判断会出错；
• 如果需要让用户能再次编辑这些复选框（而非只读），只需去掉disabled属性，并添加正确的name属性即可。

内容的提问来源于stack exchange，提问作者Jan