Magento 2 Knockout XML-> PHTML-> JS-> HTML-Java 学习之路

我想在结帐时在html登录弹出窗口中显示静态块，但是有问题 .

这是从 js 调用的 html 模板，这个js是从 phtml 调用的，这个phtml模板是从 xml layout调用的 . （ xml -> phtml -> js -> html ）

所以问题是如何从phtml或xml通过js发送自定义内容块到html模板

vendor / magento / module-catalog / view / frontend / layout / default.xml

此文件正在调用 pthml template

<block class="Magento\Customer\Block\Account\AuthenticationPopup" name="authentication-popup" as="authentication-popup" template="Magento_Customer::account/authentication-popup.phtml">

vendor / magento / module-customer / view / frontend / templates / account / authentication-popup.phtml

该文件使用代码调用 js layout ：

<script type="text/x-magento-init">
        {
            "#authenticationPopup": {
                "Magento_Ui/js/core/app": <?= /* @noEscape */ $block->getJsLayout() ?>
            }
        }
    </script>

vendor / magento / module-customer / view / frontend / web / js / view / authentication-popup.js

此文件称为最后一个 html template ，其中应该是来自管理面板的 static block ，其代码为：

define([
    'jquery',
    'ko',
    // ......... //
], function ($, ko, /* ... ... ... .... ... */) {
    'use strict';

    return Component.extend({
        registerUrl: window.authenticationPopup.customerRegisterUrl,
        forgotPasswordUrl: window.authenticationPopup.customerForgotPasswordUrl,
        autocomplete: window.authenticationPopup.autocomplete,
        modalWindow: null,
        isLoading: ko.observable(false),

        defaults: {
            template: 'Magento_Customer/authentication-popup'
        },
    });
});

这就是我在php中获取此块的方式

<?php echo $this->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('reset_password_notice')->toHtml(); ?>

我试图将其粘贴到phtml，它不起作用！

2 回答

0
您需要将此代码放入您的phtml文件中 .
```
<?php echo $this->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('reset_password_notice')->toHtml(); ?>
```
现在它显示了你写入这个块的内容 .
回复于 2024-04-26T18:16:00+08:00

问题由我自己解决 . 因此，对于第一步，我开始寻找数据提供程序，这有助于将数据从 pthml 通过 js 发送到 html 在vendor / module-customer /

在那里我找到了文件 vendor/module-customer/Model/Checkout/ConfigProvider.php . 这完全是我需要的 .

在此之后link我创建：

1） app/code/Theme/Customer/etc/frontend/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">
    <preference for="Magento\Customer\Controller\Account\CreatePost"
                type="Theme_Name\Customer\Controller\Account\CreatePost" />

    <type name="Magento\Checkout\Model\CompositeConfigProvider">
        <arguments>
            <argument name="configProviders" xsi:type="array">
                <item name="cms_block_config_provider" xsi:type="object">Theme_Name\Customer\Model\Checkout\ConfigProvider</item>
            </argument>
        </arguments>
    </type>
</config>

2）下一步是创建一个在 item 标记中调用的类： Theme_Name/Customer/Model/Checkout/ConfigProvider.php ，代码扩展
vendor/module-customer/Model/Checkout/ConfigProvider.php

注意！它们都实现了相同的ConfigProviderInterface . 因此，在新的ConifgProvider.php中，我们使用相同的接口来正确扩展数据提供程序

<?php
namespace Theme_Name\Customer\Model\Checkout;

use Magento\Checkout\Model\ConfigProviderInterface;
use Magento\Framework\View\LayoutInterface;

class ConfigProvider implements ConfigProviderInterface
{
    /** @var LayoutInterface  */
    protected $_layout;

    public function __construct(LayoutInterface $layout)
    {
        $this->_layout = $layout;
    }

    public function getConfig()
    {
        $cmsBlockId = 'block_ID'; // id of cms block to use

        return [
            'cms_block_message' => $this->_layout->createBlock('Magento\Cms\Block\Block')->setBlockId($cmsBlockId)->toHtml()
        ];
    }
}

好 . 提供商已配置 .

3）最后一个需要覆盖前端 html KO 模板：

app / design / frontend / theme_name / Magento_Customer / web / template / authentication-popup.html

写下一个：

<div data-bind="html: window.checkoutConfig.cms_block_message"></div>

回复于 2024-04-26T18:16:00+08:00

Magento 2 Knockout XML-> PHTML-> JS-> HTML

2 回答

相关问题