¿Cómo establecer el método de envío predeterminado en caso de múltiples métodos de envío en magento 2?

Hay 2 métodos de envío y, de forma predeterminada, no se selecciona a nadie, el usuario debe seleccionar uno manualmente, como resultado dice envío (indefinido-indefinido). Quiero que el primer elemento se seleccione automáticamente si no se selecciona ninguno, cómo se puede hacer en magento 2

Como entendí por su pregunta es que siempre desea tener un método de envío seleccionado cuando alguien entra en la página de pago.

Para lograr esto, necesitamos anular un javascript del módulo Magento_Checkout.

Primero lo primero, necesitamos crear un módulo:

Espacio de nombres / Módulo / registro.php

<?php

\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::MODULE,
    'Namespace_Module',
    __DIR__
);

Espacio de nombres / Módulo / etc / module.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Namespace_Module" setup_version="1.0.0">
        <sequence>
            <module name="Magento_Checkout"/>
        </sequence>
    </module>
</config>

Después de esto, necesitamos crear los requirejs para anular ese js.

Espacio de nombres / Módulo / vista / frontend / requirejs-config.js

var config = {
    map: {
        '*': {
            'Magento_Checkout/js/model/checkout-data-resolver': 'Namespace_Module/js/model/checkout-data-resolver'
        }
    }
};

Ahora tenemos que copiar checkout-data-resolver.jsdesde Magento_Checkout/view/frontend/web/js/modelnuestro módulo con la misma rutaNamespace_Module/view/frontend/web/js/model

Después de eso, necesitamos cambiar una condición dentro de la función resolveShippingRates: function (ratesData)

Desde:

            ...

            if (ratesData.length == 1) {
                //set shipping rate if we have only one available shipping rate
                selectShippingMethodAction(ratesData[0]);

                return;
            }

            ...

A:

           ...

            if (ratesData.length >= 1) {
                //set shipping rate if we have only one available shipping rate
                selectShippingMethodAction(ratesData[0]);

                return;
            }

            ...

Y eso es todo, todo lo que tienes que hacer ahora es:

• Active el módulo: módulo php bin / magento: enable Namespace_Module
• Ejecute una actualización de configuración: configuración de php bin / magento: actualización
• Haga una implementación estática: configuración de php bin / magento: contenido estático: implementación

if (ratesData.length >= 1) {
  //set shipping rate if we have only one available shipping rate
  selectShippingMethodAction(ratesData[0]);

  return;
}

Esto hará que sea imposible seleccionar cualquier otra opción de envío. Esto resuelve el problema para mí:

if (ratesData.length == 1) {
    //set shipping rate if we have only one available shipping rate;
    selectShippingMethodAction(ratesData[0]);

    return;
}

if (ratesData.length >= 1) {
    //set shipping rate if we have only one available shipping rate
    if(!selectedShippingRate) {
        selectShippingMethodAction(ratesData[0]);
    }
}

No es necesario que todo el módulo logre este cambio. Simplemente puede extender el módulo Checkout y anular en su tema.

1. Copiar el archivo js checkout-Data-resolver.js
   a partir
   vendor\magento\module-checkout\view\frontend\web\js\model
   de
   la aplicación \ diseño \ frontend \ Espacio de nombres \ THEMENAME \ Magento_Checkout \ web \ js \ modelo.

2. Localice la línea con el siguiente código:
   if (ratesData.length == 1) {
   y reemplácela con:
   if (ratesData.length >= 1 && !selectedShippingRate) {

Lo que probablemente quiera hacer es seleccionar el método de envío más barato de forma predeterminada.

En su módulo over ride checkout-data-resolver, opcionalmente puede usar un mixin en su lugar.

var config = {
    map: {
        '*': {
            'Magento_Checkout/js/model/checkout-data-resolver':'MyModule_Checkout/js/view/checkout-data-resolver'
        }
    }
}

en el método resolveShippingRates, modifique de la siguiente manera:

        /**
         * @param {Object} ratesData
         */
        resolveShippingRates: function (ratesData) {
            var selectedShippingRate = checkoutData.getSelectedShippingRate(),
                availableRate = false;
            //Added to find the cheapest rate
            var lowestRateId = _.min(_.keys(ratesData), function(k) { return ratesData[k].amount; });

            if (ratesData.length === 1) {
                //set shipping rate if we have only one available shipping rate
                selectShippingMethodAction(ratesData[0]);

                return;
            }

            // added to select the cheapest rate if no method selected

            if(lowestRateId && !selectedShippingRate && ratesData.length > 0) {
                selectShippingMethodAction(ratesData[lowestRateId]);
            }

Si bien los métodos anteriores sugieren anular las funciones js, recomendaría usar mixins para evitar conflictos de código innecesarios:

En su interfaz requirejs-config.js agregue lo siguiente:

var config = {
    config: {
        mixins: {
            'Magento_Checkout/js/model/checkout-data-resolver': {
                '{Vendor}/{Module}/model/checkout-data-resolver': true
            }
        }
    }
};

En su checkout-data-resolver.js

define([
    'underscore',
    'mage/utils/wrapper',
    'Magento_Checkout/js/checkout-data',
    'Magento_Checkout/js/action/select-shipping-method',
    'Magento_Checkout/js/action/select-payment-method'
],function (_, wrapper, checkoutData, selectShippingMethodAction) {
    'use strict';

    return function (checkoutDataResolver) {

        var resolveShippingRates = wrapper.wrap(
            checkoutDataResolver.resolveShippingRates,
            function (originalResolveShippingRates, ratesData) {
                // select your shipping method here using the ratesData and selectShippingMethodAction
                return originalResolveShippingRates(ratesData);
            }
        );

        return _.extend(checkoutDataResolver, {
            resolveShippingRates: resolveShippingRates
        });
    };
});

Alternativamente, puede descargar el módulo aquí que le permite seleccionar un método de envío y pago predeterminado : Método de envío y pago predeterminado [M2]

Cualquiera que esté usando onestepcheckout puede intentar esto:

if (ratesData.length >= 1) {
  setTimeout(function(){
     selectShippingMethodAction(ratesData[0]);
  }, 500)
  return;
}

Sé que parece estúpido, pero por alguna razón, agregar ese retraso realmente funcionó para mí. El costo de envío se está actualizando así.