장바구니에 담은 후 미니 카트 업데이트를 시작하는 방법

사용자 정의 방식으로 장바구니에 추가하는 것을 테스트하는 데 사용하는 다음 클래스가 있습니다.

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();
    }
}

이것은 잘 작동합니다. 장바구니를 볼 때 내 항목이 표시되고 데이터베이스 등에서 모두 멋지게 보입니다. 그러나 미니 카트에는 여전히 바구니에 항목이없는 것처럼 표시됩니다.

그런 다음 제품 또는 목록 페이지의 "장바구니에 추가"버튼을 사용하여 카트에 다른 제품을 추가하면 카트에 추가되고 두 ​​항목을 모두 표시하도록 미니 카트가 업데이트됩니다.

미니 카트가 어디에서 자체 업데이트를 트리거합니까? 또는 미니 카트가 새로 고침해야한다는 것을 어떻게 알 수 있습니까?

당신의 도움을 주셔서 감사합니다 :)

트리거하는 방법을 찾았습니다 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가 / customer / section / load를 다시 호출하여 섹션을로드하도록 전달합니다.

기본적으로 메시지를 요청하지만 section.xml을 올바르게 설정하면 거기에 정의한 섹션 이름도 표시됩니다.

이것은 질문과 직접 ​​관련이 없지만 일반 Magento require.js파일 에서 AJAX 호출을 통해 장바구니를 업데이트하는 경우 Magento_Customer/js/customer-data객체를 요구하고 미니 카트 에게이 방법으로 새로 고침을 요청할 수 있습니다.

<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는 스크립트 태그 및 동적 바인드 데이터 내에서 컴포넌트를 실행하여 미니 카트 사용을 차단합니다.

내가 발견 한 흥미로운 것

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

결제 레이아웃에서. 그것은 정의 componentGetData의보고 계속 minicart-콘텐츠를 Magento_Checkout/js/view/minicart볼 것

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