Knockout JS не находит атрибутов при добавлении новой области - PullRequest
Новая
       61

Knockout JS не находит атрибутов при добавлении новой области

1 голос
/ 06 марта 2020

У меня есть проект Magento2, где у меня есть миникарта с такими атрибутами, как qty, item_it et c. 

<input data-bind="attr: {
                           id: 'cart-item-'+item_id+'-qty',
                           'data-cart-item': item_id,
                           'data-item-qty': qty,
                           'data-cart-item-id': product_sku
                           }, value: qty"
                           type="number"
                           size="4"
                           class="item-qty cart-item-qty qty-box-additions">

С тех пор я добавил 2 кнопки выше и ниже, которые я хочу добавить функциональность для увеличения QTY, для этого я сделал пользовательский компонент: 

<script type="text/x-magento-init">
    {
        "*": {
            "Magento_Ui/js/core/app": {
                "components": {
                    "qty_change": {
                        "component": "Magento_Catalog/js/view/product/view/qty_change",
                        "defaultQty": 1
                    }
                 }
            }
        }
    }
</script>

Теперь я обернул поле ввода в data-bind = "scope: 'qty_change'", поэтому поле ввода теперь выглядит как this: 

<div class="control" data-bind="scope: 'qty_change'">
                <div class="details-qty qty">
                    <label class="label" data-bind="i18n: 'Qty', attr: {
                           for: 'cart-item-'+item_id+'-qty'}"></label>

                           <button data-bind="click: decreaseQty">-</button>

                           <input data-bind="attr: {
                           id: 'cart-item-'+item_id+'-qty',
                           'data-cart-item': item_id,
                           'data-item-qty': qty,
                           'data-cart-item-id': product_sku
                           }, value: qty"
                           type="number"
                           size="4"
                           class="item-qty cart-item-qty qty-box-additions">
                           <button data-bind="click: increaseQty">+</button>

                    </button>
                     </div>
                </div>

После этого я получаю

Сообщение: item_id не определен

Я понимаю, что это потому, что я изменился область действия 'qty_change', но есть ли способ сохранить ее в области действия и просто расширить текущую область с помощью моего JS? Это мой qty_change. js 

//this file is attached to the + and - button in the minicart.
define([
    'ko',
    'uiComponent'
], function (ko, Component) {
    'use strict';

    return Component.extend({
        initialize: function () {
            //initialize parent Component
            this._super();
            this.qty = ko.observable(this.defaultQty);
        },
        decreaseQty: function() {
            var newQty = this.qty() - 1;
            if (newQty < 1) {
                newQty = 1;
            }
            this.qty(newQty);
        },
        increaseQty: function() {
            var newQty = this.qty() + 1;
            this.qty(newQty);
        }

    });
});
...