Magento 2：用于选择付款方式的事件观察器

13

我正在开发一个自定义扩展，从前端结帐页面上的可用付款方式列表中选择任何付款方式时，都需要呼叫观察者。

谁能告诉我该使用哪个事件观察器？我需要调用自定义函数并将费用添加到购物车小计。

在此处输入图片说明

magento2  event-observer  payment-methods 
— 德伦·瓦索亚（Dhiren Vasoya）
source

Answers:

10

不幸的是，观察者仅在php函数中有用。这意味着要触发事件，必须首先dispatch()由本机或自定义事件分派器分派该事件。在这种情况下，所采取的措施是点击付款方式按钮。此单击不会触发任何php代码执行，仅会执行Javascript代码。

由于Magento 2中的结帐流程主要围绕Knockout JS构建，因此大多数操作都是在使用Javascript而非服务器端php的前端进行的。

Knockout JS非常灵活，可以绑定事件并观察变量。另一方面，它可能需要陡峭的学习曲线。

一个适合您的项目的角度是使用控制器而不是观察者：

1.让我们开始创建一个模块...

2.创建一个在触发时执行逻辑的控制器

控制器结构： http : //www.example.com/route/controller_folder/action

2.1创建控制器Action类：

应用程序/代码/名称空间/模块/控制器/测试/Action.php

namespace NameSpace\Module\Controller\Test;

class Action extends \Magento\Framework\App\Action\Action
{
    public function execute()
    {
        $request = $this->getRequest();
        //EXECUTE YOUR LOGIC HERE
    }
}

2.2为您的控制器注册一条路线

app / code / NameSpace / Module / etc / adminhtml / routes.xml

<?xml version="1.0"?>

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
  <router id="standard">
     <route id="route" frontName="route">
        <module name="NameSpace_Module" />
    </route>
  </router>
</config>

2.3由于这将在结帐时使用，请将您的路线添加到安全URL列表[编辑]

应用程序/代码/名称空间/模块/etc/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\Framework\Url\SecurityInfo">
        <arguments>
            <argument name="secureUrlList" xsi:type="array">
                <item name="route" xsi:type="string">/route/</item>
            </argument>
        </arguments>
    </type>
</config>

3.使用以下布局文件在结帐页面上添加一个javascript文件：

应用程序/代码/名称空间/模块/视图/前端/布局/checkout_index_index.xml

<?xml version="1.0"?>

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Magento/Framework/View/Layout/etc/page_configuration.xsd">
    <head>
       <link src="NameSpace_Module::js/payment-method-trigger.js"/>
    </head>
</page>

4.在此脚本中，您只需添加一个函数即可在每次单击“付款方式”选项卡时发送ajax发布请求。

最佳方法-淘汰赛：订阅可观察

在不扩展/覆盖核心文件或不影响原始点击功能的情况下触发点击事件的最佳方法是在Knockout的帮助下订阅一个可观察对象。

方法2-扩展JS类[编辑]

还应该有一种扩展初始JS类的方法

define([
    'NameSpace_Module/path/to/original/file', //JS FILE TO EXTEND
], function (originalFile) { //PASS AS A PARAMETER
    'use strict';

    return originalFile.extend({ //EXTEND
        //FUNCTIONS ADDED HERE WILL OVERRIDE FUNCTIONS
        //FROM ORIGINAL CLASS IF ALREADY EXISTS
        someFunction: {
            someLogic();
        },


    });
});

方法3-覆盖select-payment-method.js

有时，使用Knockout JS玩游戏可能会很困难，为此，我们将简单地覆盖负责将支付方法注册在由selectPaymentMethod函数触发的报价中的函数。与使用100％Knockout JS相比，它可能不是最优雅的解决方案，但它应该可以按预期工作，而不会影响任何功能，除非将来的Magento更新会通过修改原始功能来干扰。

为了更好地理解，您可以selectPaymentMethod在此文件的第139行找到该函数：

Magento_Checkout / js / view / payment / default.js

1.现在我们必须声明函数重写：

应用程序/代码/名称空间/模块/视图/前端/requirejs-config.js

var config = {
    map: {
        '*': {
            'Magento_Checkout/js/action/select-payment-method':
                'NameSpace_Module/js/action/payment/select-payment-method'
        }
    }
};

2.最后，我们重用负责选择付款方式的功能，并进行一些额外的调用来进行ajax调用！

应用程序/代码/ NameSpace /模块/视图/前端/ web / js /操作/付款/select-payment-method.js

define(
    [
    'jquery',
    'uiComponent',
    'ko',
    'Magento_Checkout/js/model/quote',
    ], function ($, uiComponent, ko, quote) {
        'use strict';

        function () {
            $.ajax({
                showLoader: true,
                url: 'http://www.example.com/route/controller_folder/action',
                data: { action : 1, param : 2},
                type: "POST",
                dataType: 'json'
            }).done(function (data) {
                alert('Request Sent');
            });
        };

        return function (paymentMethod) {
            quote.paymentMethod(paymentMethod);
        }
});

每次客户单击付款方式选项卡时，您的Javascript方法都会向您的控制器发送一个后ajax请求，该请求将按照您的逻辑执行php代码。

这涉及到Magento 2的几个不同方面。尽管我想为您的问题提供快速简便的解决方案，但这只是Magento 2的构建方式。现在，大部分逻辑是在客户端实现的，而在使用结帐系统时则更多。

请记住，在处理结帐系统时要格外小心，结帐页面上的错误会严重损害商店。

注意：上面所有代码未经测试

— 埃尔加蒂托
source
真正好的信息
— Pandurang
5

要求 

'Magento_Checkout/js/model/quote'

并观察 

quote.paymentMethod.subscribe(function(){console.log('yay')}, null, 'change');

因为那里有很多值得观察的地方 

var billingAddress = ko.observable(null);
var shippingAddress = ko.observable(null);
var shippingMethod = ko.observable(null);
var paymentMethod = ko.observable(null);
var totals = ko.observable(totalsData);
var collectedTotals = ko.observable({})
— 安东
source
1
谢谢！很棒！此外，如果您要检查函数内的付款方式，则可以使用第一个参数，例如： quote.paymentMethod.subscribe(function(method){console.log(method);}, null, 'change');
— Siarhey Uchukhlebau
0

这两个你可以相应地尝试 

app/code/Magento/Payment/Model/Method/Adapter.php 
    payment_method_is_active
    $this->eventManager->dispatch(
        'payment_method_is_active',
        [
    'result' => $checkResult,
    'method_instance' => $this,
    'quote' => $quote
        ]);

Or 
    app/code/Magento/Payment/Model/Method/Adapter.php 
    payment_method_assign_data_
    $this->eventManager->dispatch(
        'payment_method_assign_data_' . $this->getCode(),
        [
    'method' => $this,
    'data' => $data
        ]);
— 苏普里亚·米什拉
source
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.