Ajax购物车项目计数在WooCommerce中也显示0个产品

Question

我在WooCommerce网站上使用Elementor (Pro)，我在标题中添加了一个图标小部件，旁边添加了一个HTML元素，用CSS显示购物车计数，当向购物车中添加/删除项目时，将通过Ajax更新。

它按预期工作，当我添加一个项目时，数字增加，当我删除一个项目时，数字减少。

但是我的问题是，当购物车中没有任何东西时，元素也是可见的。它只表示数字0。我怎样才能隐藏它呢?

这是我的代码:

add_filter( 'woocommerce_add_to_cart_fragments', 'dwd_cart_count_fragments', 10, 1 );
function dwd_cart_count_fragments( $fragments ) {

$fragments['div.header-cart-count'] = '<div class="header-cart-count">' . WC()->cart->get_cart_contents_count() . '</div>';

return $fragments;

}

这是html元素:

<div class="dwd-cart-count"><?php echo WC()->cart->get_cart_contents_count(); ?></div>

和CSS:

.dwd-cart-count {
position: absolute;
top: 10px;
right: 2px;
transform: translateY(-105%) translateX(25%);
font-family: Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: 10px;
line-height: 20px;
height: 20px;
width: 20px;
vertical-align: middle;
text-align: center;
color: #fff;
background: #99c001;
border-radius: 50%;
padding: 1px;       
}

我想在过滤器之前我需要一个额外的函数。像这样的东西，但不能让它工作:

function dwd_cart_count() {     
$cart_count = WC()->cart->get_cart_contents_count();     
if ( $cart_count > 0 ) {
?>
<span class="dwd-cart-count"><?php echo $cart_count; ?></span>
<?php
}
}

Answer 1

您可以在if函数中传递get_cart_contents_count()的结果，并且只有当结果为1或更大时才返回一个数字。

得到:

function cart_contents_count() {
// Default
$result = '';
// True
if ( WC()->cart ) {
// Get number of items in the cart
$cart_contents_count = WC()->cart->get_cart_contents_count();
// Greater than or equal to
if ( $cart_contents_count >= 1 ) {
return $cart_contents_count;
}
}
return $result;
}
function dwd_cart_count_fragments( $fragments ) {
$fragments['div.header-cart-count'] = '<div class="header-cart-count">' . cart_contents_count() . '</div>';

return $fragments;
}
add_filter( 'woocommerce_add_to_cart_fragments', 'filter_woocommerce_add_to_cart_fragments', 10, 1 );

---

<div class="header-cart-count"><?php echo cart_contents_count(); ?></div>