渲染微型購物車而沒有下拉對話框

Question

渲染微型購物車而沒有下拉對話框

0

我想將微型購物車移動到畫布的側邊欄（基礎6）。我能夠移動小車瓶的佈局。

但是它始終將渲染顯示為下拉對話框（magento ui），因此我希望渲染購物車中的項目而不必先單擊標題。

<?php if ($block->getIsNeedToDisplaySideBar()): ?>
<div class="block block-minicart empty"
     data-role="dropdownDialog"
     data-mage-init='{"dropdownDialog":{
            "appendTo":"[data-block=minicart]",
            "triggerTarget":".showcart",
            "timeout": "2000",
            "closeOnMouseLeave": false,
            "closeOnEscape": true,
            "triggerClass":"active",
            "parentClass":"active",
            "buttons":[]}}'>
    <div id="minicart-content-wrapper" data-bind="scope: 'minicart_content'">
        <!-- ko template: getTemplate() --><!-- /ko -->
    </div>
    <?= $block->getChildHtml('minicart.addons') ?>
</div>

這是負責的代碼。到目前為止，我的理解是

<!-- ko template: getTemplate() --><!-- /ko -->

將替換為購物車的實際內容。我不需要或不需要下拉對話框，所以我刪除了法師初始化部分：

<?php if ($block->getIsNeedToDisplaySideBar()): ?>
<div class="block block-minicart empty">
    <div id="minicart-content-wrapper" data-bind="scope: 'minicart_content'">
        <!-- ko template: getTemplate() --><!-- /ko -->
    </div>
    <?= $block->getChildHtml('minicart.addons') ?>
</div>

這樣，只有微型購物車的頂部被渲染，我看到了JS錯誤：

TypeError: $(...).find(...).dropdownDialog is not a function

我該如何"靜態"渲染小型購物車？或至少可以讓我一次看到整個購物車。

實際上，我看不到淘汰賽js的意義。它使一切都變得更加複雜。此外，頁面會延遲渲染，一段時間後會彈出項目。這到底怎麼算是優勢？

來源分享

創建於2018-03-27 16:17:362018-03-27 16:17:36 omsta

1 答案

kunj · Answer 1 · 2018-03-28T06:09:33Z

@omsta, you can use below code.

Default it call once click on that show cart link.

<div class="block block-minicart empty"
             data-role="dropdownDialog"
             data-mage-init='{"dropdownDialog":{
                "appendTo":"[data-block=minicart]",
                "triggerTarget":".showcart",
                "timeout": "2000",
                "closeOnMouseLeave": false,
                "closeOnEscape": true,
                "triggerClass":"active",
                "parentClass":"active",
                "buttons":[]}}'>
            <div id="minicart-content-wrapper" data-bind="scope: 'minicart_content'">
                <!-- ko template: getTemplate() --><!-- /ko -->
            </div>
            <?= $block->getChildHtml('minicart.addons') ?>
        </div>

It can auto display once load mini cart content. by using "autoOpen" : true,

<div class="block block-minicart empty"
             data-role="dropdownDialog"
             data-mage-init='{"dropdownDialog":{
                "appendTo":"[data-block=minicart]",
                "triggerTarget":".showcart",
                "timeout": "2000",
                "closeOnMouseLeave": false,
                "closeOnEscape": true,
                "autoOpen" : true,
                "triggerClass":"active",
                "parentClass":"active",
                "buttons":[]}}'>
            <div id="minicart-content-wrapper" data-bind="scope: 'minicart_content'">
                <!-- ko template: getTemplate() --><!-- /ko -->
            </div>
            <?= $block->getChildHtml('minicart.addons') ?>
        </div>

OR you can use static display.

<div class="block block-minicart empty" data-bind="attr:{'style':'display:block;'}">
            <div id="minicart-content-wrapper" data-bind="scope: 'minicart_content'">
                <!-- ko template: getTemplate() --><!-- /ko -->
            </div>
            <?= $block->getChildHtml('minicart.addons') ?>
        </div>

You will need to remove close button from : /web/template/minicart/content.html

渲染微型購物車而沒有下拉對話框

1 答案