时间戳

首页 > 解决方案 > 如何在结帐页面中将应用优惠券移动到 Magento 2 的侧栏？

magento2 - 如何在结帐页面中将应用优惠券移动到 Magento 2 的侧栏？

问题描述

我想在侧边栏而不是标签部分更改位置应用优惠券。我已经在结帐页面中添加了一个几乎完成的自定义选项卡。现在我只需要侧边栏中的应用折扣代码部分。

在此处输入图像描述

我当前的 checkout_index_index.xml 看起来像这样

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
    <!-- added custom step -->
    <referenceBlock name="checkout.root">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="steps" xsi:type="array">
                                    <item name="children" xsi:type="array">
                                        <!-- The new step you add -->
                                        <item name="my-new-step" xsi:type="array">
                                            <item name="component" xsi:type="string">Magento_Checkout/js/view/my-step-view</item>
                                                <!--To display step content before shipping step "sortOrder" value should be < 1-->
                                                <!--To display step content between shipping step and payment step  1 < "sortOrder" < 2 -->
                                                <!--To display step content after payment step "sortOrder" > 2 -->
                                            <item name="sortOrder" xsi:type="string">2</item>
                                            <item name="children" xsi:type="array">
                                                <!--add here child component declaration for your step-->
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
    </referenceBlock>

    <!-- moved shipping data -->
    <referenceContainer name="content">
    <referenceBlock name="checkout.root">
        <arguments>
            <argument name="jsLayout" xsi:type="array">
                <item name="components" xsi:type="array">
                    <item name="checkout" xsi:type="array">
                        <item name="children" xsi:type="array">
                            <item name="steps" xsi:type="array">
                                <item name="children" xsi:type="array">
                                    <item name="my-new-step" xsi:type="array">
                                        <item name="children" xsi:type="array">
                                            <item name="shipping-information" xsi:type="array">
                                                <item name="sortOrder" xsi:type="string">0</item>
                                                <item name="component" xsi:type="string">Magento_Checkout/js/view/shipping-information</item>
                                                <item name="config" xsi:type="array">
                                                    <item name="deps" xsi:type="string">checkout.steps.shipping-step.shippingAddress</item>
                                                </item>
                                                <item name="displayArea" xsi:type="string">shipping-information</item>
                                                <item name="children" xsi:type="array">
                                                    <item name="ship-to" xsi:type="array">
                                                        <item name="component" xsi:type="string">Magento_Checkout/js/view/shipping-information/list</item>
                                                        <item name="displayArea" xsi:type="string">ship-to</item>
                                                    </item>
                                                </item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                            <item name="sidebar" xsi:type="array">
                                <item name="children" xsi:type="array">
                                    <item name="shipping-information" xsi:type="array">
                                        <item name="config" xsi:type="array">
                                            <item name="componentDisabled" xsi:type="boolean">true</item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </item>
            </argument>
        </arguments>
    </referenceBlock>
</referenceContainer>

<!-- apply cupon custom code -->

<referenceBlock name="checkout.root">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="steps" xsi:type="array">
                                    <item name="children" xsi:type="array">
                                        <item name="billing-step" xsi:type="array">
                                            <item name="children" xsi:type="array">
                                                <item name="payment" xsi:type="array">
                                                    <item name="children" xsi:type="array">
                                                        <item name="afterMethods" xsi:type="array">
                                                            <item name="config" xsi:type="array">
                                                                <item name="componentDisabled" xsi:type="boolean">true</item>
                                                            </item>
                                                        </item>
                                                    </item>
                                                </item>
                                            </item>
                                        </item>         
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>


                <referenceBlock name="checkout.root">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="steps" xsi:type="array">
                                    <item name="children" xsi:type="array">
                                        <item name="sidebar" xsi:type="array">
                                        <item name="sidebar" xsi:type="boolean">true</item>
                                            <item name="component" xsi:type="string">uiComponent</item>
                                            <item name="children" xsi:type="array">
                                                <item name="discount" xsi:type="array">
                                                    <item name="component" xsi:type="string">Magento_SalesRule/js/view/payment/discount</item>
                                                    <item name="sortOrder" xsi:type="string">2</item>
                                                    <item name="children" xsi:type="array">
                                                        <item name="errors" xsi:type="array">
                                                            <item name="sortOrder" xsi:type="string">0</item>
                                                            <item name="component" xsi:type="string">Magento_SalesRule/js/view/payment/discount-messages</item>
                                                            <item name="displayArea" xsi:type="string">messages</item>
                                                        </item>
                                                    </item>
                                                </item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
</body>
</page>

如何更改应用折扣码位置？

标签： magento2checkout

解决方案

下面 checkout_index_index.xml 将有助于在结帐页面的侧边栏中添加“应用优惠券代码”。

<referenceBlock name="checkout.root">
<arguments>
    <argument name="jsLayout" xsi:type="array">
        <item name="components" xsi:type="array">
            <item name="checkout" xsi:type="array">
                <item name="children" xsi:type="array">
                    <item name="sidebar" xsi:type="array">
                        <item name="children" xsi:type="array">
                            <item name="summary" xsi:type="array">
                                <item name="children" xsi:type="array">
                                    <item name="discount" xsi:type="array">
                                        <item name="component" xsi:type="string">Magento_SalesRule/js/view/payment/discount</item>
                                        <item name="children" xsi:type="array">
                                            <item name="errors" xsi:type="array">
                                                <item name="sortOrder" xsi:type="string">0</item>
                                                <item name="component" xsi:type="string">Magento_SalesRule/js/view/payment/discount-messages</item>
                                                <item name="displayArea" xsi:type="string">messages</item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </item>
            </item>
        </item>
    </argument>
</arguments>
</referenceBlock>

推荐阅读