What is data-post, data-action in magento 2? Can anyone explain wishlist functionality?

Question

Can anyone explain below code? How did it work?

Is there any alternate way to do?

 <a href="#" data-post='<?php  echo $this->helper('Magento\Wishlist\Helper\Data')->getAddParams($_product) ?>' class="action towishlist" data-action="add-to-wishlist"><span>Add to Wishlist</span></a>

Answer 1

As you can see in widget lib/web/mage/dataPost.js

$.each(this.options.postTrigger, function (index, value) {
    events['click ' + value] = '_postDataAction';
});

On click to elements which satisfy the selectors ['a[data-post]', 'button[data-post]', 'span[data-post]'] will be created and submitted form with params, specified in data-post attribute value.

Additionally, you can specify confirmation message

if (params.data.confirmation) {
    uiConfirm({
        content: params.data.confirmationMessage,
        actions: {
            /** @inheritdoc */
            confirm: function () {
                $form.appendTo('body').hide().submit();
            }
        }
    });
} else {
    $form.appendTo('body').hide().submit();
}

Answer 2

If you go to the MagentoInstallationDirectory/vendor/magento/module-wishlist/Helper/Data.php You will see the getAddParams function which describes how product is added to the wishlist.