Magento 从 mixin 访问 jsLayout 配置数据

Question

我想扩展一个敲除组件的功能。我已将配置添加到有问题的 xml 文件中：

<arguments>
    <argument name="jsLayout" xsi:type="array">
        <item name="components" xsi:type="array">
...
            <item name="example">
                ... other properties of the component
                <item name="config" xsi:type="array">
                    <item name="SomeConfigVariable" xsi:type="string">true</item>
                </item>
            </item>
...
        </item>
    </argument>
</arguments>

我已经使用我的模块包含了 mixin requirejs-config.js，我可以看到它在我的浏览器中遇到了断点。

var config = {
    config: {
        mixins: {
            "Magento_MODULE/js/view/example": {
                "VENDOR_MODULE/js/view/example-mixin": true,
            }
        },
    },
};

但是我似乎找不到获取配置数据所需的代码，我试过这个：

define(["ko"], function (ko) {
    var mixin = {
        imports: {
            someConfigVariable: "${ $.SomeConfigVariable }", // Doesn't seem to do anything
        },

        initialize: function () {
            this.someConfigVariable = false; // Default value
            this._super();
            return this;
        },
    };

    return function (target, config) { // config is undefined
        return target.extend(mixin);
    };
});

我错过了什么？

Answer 1

mixin 代码不是严格必需的。像这样将其设置为默认值：

define(["ko"], function (ko) {
    var mixin = {
        defaults: {
            someConfigVariable: false,
        },

        initialize: function () {
            this._super();
            return this;
        },
    };

    return function (target) {
        return target.extend(mixin);
    };
});

并更新布局 xml 如下所示：

<arguments>
    <argument name="jsLayout" xsi:type="array">
        <item name="components" xsi:type="array">
...
            <item name="example">
                ... other properties of the component
                <item name="config" xsi:type="array">
                    <item name="SomeConfigVariable" xsi:type="boolean">true</item> <!-- Note the xsi:type as boolean -->
                </item>
            </item>
...
        </item>
    </argument>
</arguments>

当运行组件时得到我想要的结果。 Magento 在点击 initConfig 方法之前对 config 元素做了一些魔术。

Magento 从 mixin 访问 jsLayout 配置数据

Magento accessing jsLayout config data from a mixin

magento

mixins

knockout.js

magento2