วิธีการทริกเกอร์การอัปเดต minicart หลังจากเพิ่มลงในรถเข็น

ฉันมีคลาสต่อไปนี้ที่ฉันใช้ในการทดสอบการเพิ่มในรถเข็นด้วยวิธีที่กำหนดเอง

use Magento\Framework\App\Action;
use Magento\Checkout\Model\Cart;

class Add extends Action\Action
{
    protected $cart;

    public function __construct(
        Action\Context $context,
        Cart $cart
    ){
        $this->cart = $cart;
        parent::__construct($context);
    }

    public function execute()
    {
        $this->cart->addProductsByIds([1])
            ->save();
    }
}

มันใช้งานได้ดี เมื่อคุณดูรถเข็นมันจะแสดงรายการของฉันทุกคนดูดีในฐานข้อมูล ฯลฯ อย่างไรก็ตามมินิคาร์ทยังคงแสดงราวกับว่าไม่มีรายการในตะกร้า

หากฉันเพิ่มผลิตภัณฑ์อื่นลงในรถเข็นโดยใช้ปุ่ม "เพิ่มลงในรถเข็น" บนหน้าผลิตภัณฑ์หรือรายชื่อซึ่งจะเพิ่มลงในรถเข็นและอัปเดต minicart เพื่อแสดงทั้งสองรายการ

มันจะทริกเกอร์ minicart เพื่ออัพเดทตัวเองหรือ minicart รู้ได้อย่างไรว่ามันจำเป็นต้องรีเฟรช?

ขอบคุณสำหรับความช่วยเหลือของคุณ :)

ฉันได้พบวิธีการทริกเกอร์คุณต้องตั้งค่าส่วนsections.xmlภายใน / ส่วนหน้าของโมดูลของคุณซึ่งบอก Magento ว่าส่วนใดที่ต้องอัปเดตสำหรับการโทร Ajax ที่กำหนด นี่คือตัวอย่าง;

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Customer:etc/sections.xsd">
    <action name="[frontName]/[ActionPath]/[ActionName]">
        <section name="cart"/>
    </action>
</config>

หลังจากการโทร Ajax ของฉันเสร็จสิ้นไปยัง[frontName]/[ActionPath]/[ActionName]Magento ทำให้การโทรไปยัง / ลูกค้า / ส่วน / โหลดอีกครั้งผ่านการโหลดส่วน

ตามค่าเริ่มต้นคำขอข้อความใด ๆ แต่หากคุณตั้งค่าส่วนของคุณอย่างถูกต้องแล้วคุณจะเห็นชื่อส่วนที่คุณกำหนดไว้เช่นกัน

นี่ไม่เกี่ยวข้องกับคำถามโดยตรง แต่ถ้าคุณกำลังอัปเดตรถเข็นผ่านการโทร AJAX ในrequire.jsไฟล์Magento ปกติคุณสามารถMagento_Customer/js/customer-dataขอวัตถุและขอให้ minicart รีเฟรชด้วยวิธีนี้ได้เช่นกัน:

<script>
    require([
        'Magento_Customer/js/customer-data'
    ], function (customerData) {
        var sections = ['cart'];
        customerData.invalidate(sections);
        customerData.reload(sections, true);
    });
</script>

ที่มา: https://github.com/magento/magento2/issues/5621

ในหน้าร้านถ้าคุณดำน้ำในแหล่งในมินิมาร์ท

<div data-block="minicart" class="minicart-wrapper">
  <a class="action showcart" 
   data-bind="scope: 'minicart_content'">
     ... 
  </a>

   <script type="text/x-magento-init">
   {
    "[data-block='minicart']": {
        "Magento_Ui/js/core/app": {"components":{....}
     }
   }
</script>
</div>

ดังที่คุณสามารถดูได้ที่นี่ magento2 เรียกใช้งานส่วนประกอบภายในแท็กสคริปต์และข้อมูลผูกแบบไดนามิกเพื่อบล็อก minicart ใช้ knockoutJs

สิ่งที่น่าสนใจที่ฉันค้นพบ

\vendor\magento\module-checkout\view\frontend\layout\default.xml

จากเค้าโครง Checkout มันกำหนดcomponentสำหรับ minicart-content เพื่อ getdata ดำเนินการต่อดูว่าMagento_Checkout/js/view/minicartคุณจะเห็น

.....
$('[data-block="minicart"]').on('contentLoading', function(event) {
      addToCartCalls++;
      self.isLoading(true);
});
.....