Giới thiệu về nút phụ trợ Magento2 nút Lưu Lưu, trực tiếp Lưu

Để tạo một hình thức phụ trợ qua ui_component, tôi xác định sau đây trong tập tin cấu hình để hiển thị các nút tiết kiệm và saveAndContinue Nút

<item name="buttons" xsi:type="array">
    <item name="save" xsi:type="string">namespace\module\Block\Adminhtml\Edit\SaveButton</item>
    <item name="save_and_continue" xsi:type="string">namespace\module\Block\Adminhtml\Edit\SaveAndContinueButton</item>
</item>

Tương ứng, hai tệp SaveButton.phpvà SaveAndContinueButton.phpđược tạo và cả hai thực hiệnButtonProviderInterface

Như tôi biết, nút chủ yếu được kết xuất từ ​​một getButtonDatachức năng. XemSaveAndContinueButton.php

public function getButtonData()
{
    $TodoItemId = $this->getTodoItemId();
    $data = [];
    if ($TodoItemId) {
        $data = [
            'label' => __('Save and Continue Edit'),
            'class' => 'save',
            'data_attribute' => [
                'mage-init' => [
                    'button' => ['event' => 'saveAndContinueEdit'],
                ],
            ],
            'sort_order' => 80,
        ];
    }
    return $data;
}

Các data_attributelà nơi mà tôi không hiểu. Làm thế nào để nó biết tập tin nào để xử lý lưu yêu cầu?

Nếu chúng tôi kiểm tra SaveButton.php, chúng tôi đã thấy

$data = [
    'label' => __('Save TodoItem'),
    'class' => 'save primary',
    'data_attribute' => [
        'mage-init' => ['button' => ['event' => 'save']],
        'form-role' => 'save',
    ],
    'sort_order' => 90,
];

Tôi biết trong tập tin cấu hình ui_component, có

<item name="submit_url" xsi:type="url" path="path/to/save"/>

Cả hai hành động thực hiện thành công cùng một Save.phptập tin và nó có ý nghĩa. Điều khiến tôi bối rối là nhiều data_attributevà làm thế nào để SaveAndContinueButton vượt qua tham số " back" để nó biết ở cùng một trang thay vì đi vào lưới (thông thường lưới là điểm vào của một biểu mẫu, còn gọi là trang chỉnh sửa).

Nếu chúng ta nhìn khác deleteButton, đó là một cảnh quan khác

$data = [
    'label' => __('Delete'),
    'class' => 'delete',
    'on_click' => 'deleteConfirm(\'' . __(
        'Are you sure you want to do this?'
    ) . '\', \'' . $this->getDeleteUrl() . '\')',

    'sort_order' => 20,
];

Nó trực tiếp thực hiện sự kiện onClick JavaScript. Bất kỳ ý tưởng / đề nghị sẽ được đánh giá cao. cảm ơn

Một câu hỏi nữa: sự khác biệt của data_attributevà on_click? hoặc lợi thế hơn một cái khác?

Tôi không có một lời giải thích đầy đủ, nhưng tôi có một ý tưởng.
Tất cả các yếu tố được kết xuất với mage-initý chí / nên được xử lý bằng một số mã javascript.
Bạn đang liên kết các nút này với một biểu mẫu và biểu mẫu được xử lý bởi tệp js này lib/web/mage/backend/form.jsnơi tạo tiện ích jquery ui.

Đây là các tùy chọn cho widget

options: {
    handlersData: {
        save: {},
        saveAndContinueEdit: {
            action: {
                args: {
                    back: 'edit'
                }
            }
        },
        preview: {
            target: '_blank'
        }
    }
},

bạn có thể thấy một saveAndContinueEdittrong đó ở đâu đó bên trong handlersData.
Tìm kiếm tập quán của handlersData bạn cuối cùng ở _beforeSubmitnơi một số phép thuật xảy ra (tôi không thực sự hiểu mọi thứ trong đó), và tại một thời điểm _processDatađược gọi.
Di chuyển đến _processDatabạn sẽ thấy một cái gì đó như thế này

if (attrName === 'action') {
    data[attrName] = this._getActionUrl(attrValue);
}

điều này có nghĩa là actionhình thức được thay đổi dựa trên nút được nhấn.

các _getActionUrlchức năng trông như thế này

_getActionUrl: function(data) {
    if ($.type(data) === 'object') {
        return this._buildURL(this.oldAttributes.action, data.args);
    } else {
        return $.type(data) === 'string' ? data : this.oldAttributes.action;
    }
},

bạn có thể thấy trong đó có data.argsliên quan. Các biến tương tự trong các tùy chọn widget cho saveAndContinueEdit.

Kết luận: Khi bạn đặt saveAndContinueEditnút gửi vai trò toa, hành động của biểu mẫu được thay đổi thông qua js và back/editđược thêm vào url.

on_clickđược chuyển thành onclicksự kiện và được gọi đơn giản.
Tôi thực sự không biết tại sao có 2 cách để làm điều này. Có lẽ các deletehành động chưa được tái cấu trúc.