Minicart quantity number not update with full page cache in custom theme

Question

I'm using Magento CE 2.3.4. I used a custom theme for my website. In my top menu template, I tried this code to show my minicart and mini item quantity number:

$counter = $this->helper('\Magento\Checkout\Helper\Cart');
$total = $counter->getSummaryCount();
...
<i class="fas fa-shopping-cart"></i>
<?php if($total) : ?>
    <span class="count-cart-item"><?php echo $total; ?></span>
<?php endif; ?>

It's work fine when I disable full page cache and block html cache, I added product to cart and it update and show quatity correctly. But when I enable full cache, the quantity number in minicart is not updated.

If I go to cache management and flush cache, refresh page, it show correctly. Here is an image about this problem for clearly:

Hope you can give me a solution for this!

Thank you very much!

Answer 1

Try following code

$counter = $this->helper('\Magento\Checkout\Helper\Cart'); 
echo $counter->getItemsCount();

1. getItemsCount() -- return shopping cart items count means how many sku add to shopping cart.
2. getSummaryCount() -- return shopping cart items summary (suppose you add sku1 6 qty and sku2 3 qty = total 9 qty return)