如何在 Magento 2 中扩展 .js 和 .html 文件
-
28-09-2020 - |
题
我正在延长 customer address
对于这些我必须 修改/扩展 vendor/Magento/module-ui
核心文件。
IE
root/vendor/magento/module-ui/view/base/web/js/form/components/collection.js
和
root/vendor/magento/module-ui/view/base/web/templates/form/components/collection.html
当我修改核心文件时,它工作正常,但这不是一个好的扩展过程/想法。
所以我将供应商名称创建为 Magento
在 root/app/code/
我已将修改后的上述文件放置到本地的同一文件夹中。
IE
root/app/code/magento/module-ui/view/base/web/js/form/components/collection.js
和
root/app/code/magento/module-ui/view/base/web/templates/form/components/collection.html
放置这些文件后,我清除了缓存。但它仍然没有显示我的更改。
我已经跑了 php bin/magento setup:static-content:deploy
也有命令但没有运气。
你能建议我该怎么做吗?
解决方案 2
终于成就了自己。
创造 requirejs-config.js
文件来自 学习/HelloWorld/视图/基础 并粘贴下面的代码
var config = {
map: {
'*': {
'Magento_Ui/js/form/components/collection':'Learning_HelloWorld/js/form/components/collection'
}
}
};
创造 collection.js
文件来自 学习/HelloWorld/view/base/web/js/form/components 并复制粘贴核心代码并对其进行修改。
/**
* Copyright © 2015 Magento. All rights reserved.
* See COPYING.txt for license details.
*/
define([
'underscore',
'mageUtils',
'uiRegistry',
'uiComponent',
'uiLayout',
'Magento_Ui/js/modal/confirm'
], function (_, utils, registry, Component, layout, confirm) {
'use strict';
var childTemplate = {
parent: '${ $.$data.name }',
name: '${ $.$data.childIndex }',
dataScope: '${ $.name }',
nodeTemplate: '${ $.$data.name }.${ $.$data.itemTemplate }'
};
return Component.extend({
defaults: {
lastIndex: 0,
template: 'Learning_HelloWorld/form/components/collection'
},
/* my custom methods */
sendAddress: function (elem) {
var self = this;
self._sendAddress(elem);
},
/* my custom methods */
_sendAddress: function (elem) {
this.bubble('update');
}
});
});
创造 collection.html
文件来自 学习/HelloWorld/view/base/web/template/form/components 路径并粘贴核心代码并修改
<div class="ui-tabs">
<!-- My Extra html code -->
<button type="button" data-bind="click: $parent.sendAddress.bind($parent, element)">
Send this Address
</button>
</div>
现在运行以下命令。
- 设置:升级
- 设置:静态内容:部署
现在它会起作用了。
如有任何疑问,请随时询问。
其他提示
一个模块注册在一个路径下,这就是为什么它可以从供应商读取,但不能从应用程序/代码读取。