カートに追加した後にミニカートの更新をトリガーする方法


10

カスタムの方法でカートへの追加をテストするために使用している次のクラスがあります。

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

これはうまくいきます。カートを表示すると、私のアイテムが表示されますが、すべてデータベースなどで見栄えがします。しかし、ミニカートはまだバスケットにアイテムがないかのように表示します。

次に、商品またはリストページの[カートに追加]ボタンを使用して別の商品をカートに追加すると、カートに追加され、ミニカートが更新されて両方の商品が表示されます。

ミニカーが自分自身を更新するきっかけはどこですか、またはミニカーは更新が必要であることをどのようにして知るのですか?

回答:


36

ご協力いただきありがとうございます :)

私はそれをトリガーする方法を見つけましたsections.xml、モジュールの内部etc / frontend をセットアップして、特定のAjax呼び出しで更新するセクションをMagentoに指示する必要があります。以下に例を示します。

<?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>

[frontName]/[ActionPath]/[ActionName]Magento へのAjax呼び出しが終了した後、ロードするセクションを渡して/ customer / section / loadをもう一度呼び出します。

デフォルトではメッセージを要求しますが、sections.xmlを正しく設定した場合は、そこで定義したセクション名も表示されます。


@smartic、良い情報ここからクリューを得た
Amit Bera


すばらしい、私はajaxを介して他のブロックの更新に取り組んでおり、これにより私はそこに行きました。ソリューションを投稿していただきありがとうございます。
Eirik

@Smartieいくつかのmagento api呼び出しの後にカートセクションを更新する方法はありますか?
ND17

1
@Smartie複数の商品を追加する場合、最初の商品の数量のみが更新され、残りの商品数はミニカートに表示されません。ここに何か追加する必要がありますか?
DEEP JOSHI 2017年

6

これは質問とは直接関係ありませんが、通常の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


だから私は自分のカスタムpage_layoutの解決策を探してここにそれを作りました。カスタムページに移動すると、ミニカートの数は常に0でした。結局実行customerData.invalidate(sections);しなければならなくなったので、Magentoは残りを実行することができました。
James Harrington

2

店先で、ミニカーエリアのソースでダイビングする場合

<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の使用をブロックする動的バインドデータをノックアウトJsします。

私が発見した興味深いもの

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

チェックアウトレイアウトから。これは、componentminicart-contentがgetdataを継続することを定義しMagento_Checkout/js/view/minicartます。

.....
$('[data-block="minicart"]').on('contentLoading', function(event) {
      addToCartCalls++;
      self.isLoading(true);
});
.....
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.