WooCommerce切换变量产品变体时动态获取对应价格实现方法

你现有代码无法实现需求的核心问题有三个：

• PHP是服务端执行语言，页面渲染完成后代码就已经运行结束，无法直接响应前端用户选择变体的交互，不可能自动更新变量值。
• 现有逻辑没有做变体和价格的映射存储，循环遍历变体时只是反复覆盖临时变量，最终给$amount的赋值只是循环最后一轮拿到的变体价格，根本没有建立变体选择和价格的对应关系。
• 额外注意：你把自定义函数get_product_variation_price写在if条件块里，一旦这段逻辑被重复执行，会直接触发PHP「函数重复定义」的致命错误，属于不规范写法。

WooCommerce本身已经在产品页加载了所有变体的前端交互逻辑，不需要你重复查询数据库获取变体价格，按下面两部分修改即可：

1. PHP端：提前输出变体价格映射到前端 #

把下面代码放到主题functions.php或者自定义功能插件中，作用是提前整理好所有变体的对应价格，传递给前端JS调用，同时初始化默认价格：

add_action( 'wp_enqueue_scripts', function() {
    global $product;
    if ( ! is_product() || ! $product || ! $product->is_type('variable') ) {
        return;
    }

    $variation_price_map = [];
    $available_variations = $product->get_available_variations();
    foreach ( $available_variations as $variation ) {
        // 按你的需求替换小数点为逗号，如需带价格符号可以改用$variation['price_html']
        $variation_price_map[ $variation['variation_id'] ] = str_replace( '.', ',', $variation['display_price'] );
    }

    // 获取默认选中变体的价格作为初始值
    $default_vid = $product->get_matching_variation( $product->get_default_attributes() );
    $initial_amount = $default_vid ? $variation_price_map[ $default_vid ] : str_replace( '.', ',', $product->get_price() );

    // 把数据注入到前端变体脚本的作用域
    wp_localize_script( 'wc-add-to-cart-variation', 'product_variation_cfg', [
        'price_map' => $variation_price_map,
        'default_amount' => $initial_amount
    ]);
}, 20 );

2. 前端JS：监听变体选择事件自动更新价格 #

把下面代码放到产品页模板，或者通过wp_add_inline_script挂载到WooCommerce变体脚本后面，监听变体选择事件实时更新amount值：

// 初始化amount变量为默认价格
let amount = product_variation_cfg.default_amount;

// 监听变体选中完成事件
jQuery(document).on('found_variation', 'form.variations_form.cart', function(e, variationData) {
    if ( product_variation_cfg.price_map.hasOwnProperty(variationData.variation_id) ) {
        amount = product_variation_cfg.price_map[variationData.variation_id];
        // 此处写入你拿到更新后amount需要执行的业务逻辑，比如渲染到页面、上报数据等
        console.log('当前选中变体价格：', amount);
    }
});

// 监听变体选择重置事件，恢复默认价格
jQuery(document).on('reset_data', 'form.variations_form.cart', function() {
    amount = product_variation_cfg.default_amount;
    console.log('已重置为默认价格：', amount);
});

如果你需要的是带货币符号的格式化价格，只需要把PHP里存价格的字段从display_price换成price_html即可，不需要自己额外做格式化处理。

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