ฉันต้องการปรับแต่ง minicart ของฉันใน Magento 2 ฉันต้องเพิ่ม 3 คุณสมบัติ


12

ฉันต้องการปรับแต่ง minicart ของฉันใน Magento 2 ฉันต้องเพิ่ม 3 คุณลักษณะ: SKU, ผู้ผลิตและหมายเลขผู้ผลิต เหล่านี้เป็นคุณสมบัติที่มีอยู่ ฉันเห็นตำแหน่งที่จะเพิ่มค่าเอาต์พุต แต่จะไม่เรียกจากที่ใด

คำตอบ:


26

คุณสามารถสร้างโมดูลเพื่อทำสิ่งนี้ มันจะใช้ปลั๊กอินเพื่อเพิ่มคุณสมบัติไปยังอาร์เรย์ข้อมูลที่อ่านโดยแม่แบบที่น่าพิศวง js จากนั้นเราต้องแทนที่เทมเพลตเพื่อแสดงค่าเหล่านี้

นี่คือไดเรกทอรีโมดูล:

|   registration.php
|   
+---etc
|   |   module.xml
|   |   catalog_attributes.xml
|   |   
|   \---frontend
|           di.xml
|           
+---Plugin
|       DefaultItem.php
|       
\---view
    +---frontend
    |   \---layout
    |           checkout_cart_sidebar_item_renderers.xml
    |           
    \---web
        \---template
            \---mini cart
                \---item
                        default.html

catalog_attributes.xml

<?xml version="1.0"?>

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Catalog:etc/catalog_attributes.xsd">
    <group name="quote_item">
        <attribute name="manufacturer"/>
        <attribute name="part_number"/>
    </group>
</config>

di.xml

<?xml version="1.0"?>

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <type name="Magento\Checkout\CustomerData\DefaultItem">
        <plugin name="AddAttPlug" type="Your\Module\Plugin\DefaultItem" disabled="false" sortOrder="10"/>
    </type>
</config>

DefaultItem.php

<?php

namespace Your\Module\Plugin;

use Magento\Quote\Model\Quote\Item;

class DefaultItem
{
    public function aroundGetItemData($subject, \Closure $proceed, Item $item)
    {
        $data = $proceed($item);
        $product = $item->getProduct();

        $atts = [
            "product_manufacturer" => $product->getAttributeText('manufacturer'),
            "product_part_number" => $product->getAttributeText('product_part_number')
        ];

        return array_merge($data, $atts);
    }
}

SKU มีอยู่แล้วในข้อมูลจึงไม่จำเป็นต้องเพิ่ม

checkout_cart_sidebar_item_renderers.xml

<?xml version="1.0"?>

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="minicart">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="minicart_content" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="item.renderer" xsi:type="array">
                                    <item name="config" xsi:type="array">
                                        <item name="template" xsi:type="string">Your_Module/minicart/item/default</item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

default.htmlเป็นสำเนาของMagento/Checkout/view/frontend/web/template/minicart/item/default.htmlการเปลี่ยนแปลงที่บรรทัด 66

<li class="item product product-item" data-role="product-item">
    <div class="product">
        <!-- ko if: product_has_url -->
        <a data-bind="attr: {href: product_url, title: product_name}" tabindex="-1" class="product-item-photo">
            <!-- ko foreach: $parent.getRegion('itemImage') -->
                <!-- ko template: {name: getTemplate(), data: item.product_image} --><!-- /ko -->
            <!-- /ko -->
        </a>
        <!-- /ko -->
        <!-- ko ifnot: product_has_url -->
        <span class="product-item-photo">
            <!-- ko foreach: $parent.getRegion('itemImage') -->
                <!-- ko template: {name: getTemplate(), data: item.product_image} --><!-- /ko -->
            <!-- /ko -->
        </span>
        <!-- /ko -->

        <div class="product-item-details">
            <strong class="product-item-name">
                <!-- ko if: product_has_url -->
                <a data-bind="attr: {href: product_url}, text: 
                  product_name"></a>
                <!-- /ko -->
                <!-- ko ifnot: product_has_url -->
                    <!-- ko text: product_name --><!-- /ko -->
                <!-- /ko -->
            </strong>

            <!-- ko if: options.length -->
            <div class="product options" data-mage-init='{"collapsible":{"openedState": "active", "saveState": false}}'>
                <span data-role="title" class="toggle"><!-- ko i18n: 'See Details' --><!-- /ko --></span>

                <div data-role="content" class="content">
                    <strong class="subtitle"><!-- ko i18n: 'Options Details' --><!-- /ko --></strong>
                    <dl class="product options list">
                        <!-- ko foreach: { data: options, as: 'option' } -->
                        <dt class="label"><!-- ko text: option.label --><!-- /ko --></dt>
                        <dd class="values">
                            <!-- ko if: Array.isArray(option.value) -->
                                <span data-bind="html: option.value.join('<br>')"></span>
                            <!-- /ko -->
                            <!-- ko ifnot: Array.isArray(option.value) -->
                                <span data-bind="html: option.value"></span>
                            <!-- /ko -->
                        </dd>
                        <!-- /ko -->
                    </dl>
                </div>
            </div>
            <!-- /ko -->

            <div class="product-item-pricing">
                <!-- ko if: canApplyMsrp -->

                <div class="details-map">
                    <span class="label" data-bind="i18n: 'Price'"></span>
                    <span class="value" data-bind="i18n: 'See price before order confirmation.'"></span>
                </div>
                <!-- /ko -->
                <!-- ko ifnot: canApplyMsrp -->
                <!-- ko foreach: $parent.getRegion('priceSidebar') -->
                    <!-- ko template: {name: getTemplate(), data: item.product_price, as: 'price'} --><!-- /ko -->
                <!-- /ko -->
                <!-- /ko -->

                <div data-bind="html: 'SKU#: ' + item.product_sku"></div>
                <div data-bind="html: 'Manufacturer: ' + item.product_manufacturer"></div>
                <div data-bind="html: 'Part #: ' + item.product_part_number"></div>

                <div class="details-qty qty">
                    <label class="label" data-bind="i18n: 'Qty', attr: {
                           for: 'cart-item-'+item_id+'-qty'}"></label>
                    <input data-bind="attr: {
                           id: 'cart-item-'+item_id+'-qty',
                           'data-cart-item': item_id,
                           'data-item-qty': qty,
                           'data-cart-item-id': product_sku
                           }, value: qty"
                           type="number"
                           size="4"
                           class="item-qty cart-item-qty"
                           maxlength="12"/>
                    <button data-bind="attr: {
                           id: 'update-cart-item-'+item_id,
                           'data-cart-item': item_id,
                           title: $t('Update')
                           }"
                            class="update-cart-item"
                            style="display: none">
                        <span data-bind="i18n: 'Update'"></span>
                    </button>
                </div>
            </div>

            <div class="product actions">
                <!-- ko if: is_visible_in_site_visibility -->
                <div class="primary">
                    <a data-bind="attr: {href: configure_url, title: $t('Edit item')}" class="action edit">
                        <span data-bind="i18n: 'Edit'"></span>
                    </a>
                </div>
                <!-- /ko -->
                <div class="secondary">
                    <a href="#" data-bind="attr: {'data-cart-item': item_id, title: $t('Remove item')}"
                       class="action delete">
                        <span data-bind="i18n: 'Remove'"></span>
                    </a>
                </div>
            </div>
        </div>
    </div>
</li>

มีอะไรใน register.php และ module.xml?
Matthew McLennan

ฉันเพิ่มสิ่งนี้และตอนนี้สถานะเอาต์พุตของฉัน "UNDEFINED" หมายความว่าทำงานได้ แต่ฉันมีคุณสมบัติของฉันผิด
Matthew McLennan

Registration.php และ module.xml เป็นไฟล์สำเร็จรูปคุณควรตรวจสอบบทแนะนำนี้alanstorm.com/magento_2_mvvm_mvcเพื่อรับการจัดการเกี่ยวกับวิธีการกำหนดโมดูล m2 คุณอาจโพสต์ภาพหน้าจอของข้อผิดพลาดที่คุณได้รับหรืออื่น ๆ ที่เฉพาะเจาะจงมากขึ้น
Aaron Allen

@AaronAllen มันใช้งานได้สำหรับฉัน แต่ฉันต้องการแทนที่ content.html ของ minicart เดียวกันและต้องการเพิ่มข้อมูลแบบไดนามิกบางอย่างในไฟล์นั้น คุณช่วยอธิบายได้ไหมว่าฉันจะทำได้อย่างไร ขอบคุณล่วงหน้า !
Ashish Jagnani

2
หากโหลดแอตทริบิวต์ใน aroundGetItemData () คุณสามารถเพิ่มแอตทริบิวต์เหล่านั้นไปยัง etc / catalog_attributes.xml หลังจากทำเสร็จแล้วแอททริบิวต์สามารถเข้าถึงได้ด้วย $ item-> getProduct () -> getAttributeText ('attribute_code'); _productRepo ไม่จำเป็นอีกต่อไป
Andreas Riedmüller

0

ฉันมีคำถามของฉัน slove โดย 2 ขั้นตอนง่าย ๆ ใน magento 2.1:

เปลี่ยนเป็นไฟล์: ->

1.DefaultItem.php เพิ่มบรรทัด:

    $objectManager = \Magento\Framework\App\ObjectManager::getInstance();
    $this->product = $objectManager->get('Magento\Catalog\Model\Product')-
    >load($this->item->getId());

   *Add element into return array result:*

   'short_description' => $this->product->getShortDescription(),

2.default.html เพิ่มบรรทัด:

   <a data-bind="text: short_description"></a>

ฉันหวังว่านี่จะช่วยคุณได้

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.