ฉันจะพยายามตอบคำถามของคุณ
ไม่ นี่ไม่ใช่วิธีที่ถูกต้องในการเพิ่มแอตทริบิวต์ที่กำหนดเองไปยังแบบฟอร์มที่อยู่จัดส่ง new-customer-address.jsคุณไม่จำเป็นต้องแก้ไข แท้จริงแล้วไฟล์ JS นี้แสดงรายการแอตทริบิวต์ที่อยู่ที่กำหนดไว้ล่วงหน้าทั้งหมดและจับคู่ส่วนต่อประสานด้านหลังที่เกี่ยวข้อง\Magento\Quote\Api\Data\AddressInterfaceแต่วีโอไอพีให้ความสามารถในการส่งแอตทริบิวต์ที่กำหนดเองใด ๆ ไปยังแบ็กเอนด์โดยไม่ต้องแก้ไขคอมโพเนนต์แบ็กเอนด์ / ส่วนหน้า
คอมโพเนนต์ JS ที่กล่าวถึงมีcustomAttributesคุณสมบัติ แอตทริบิวต์ที่กำหนดเองของคุณจะได้รับการจัดการโดยอัตโนมัติหาก$dataScopePrefixเป็น " shippindAddress.custom_attributes"
หากฉันเข้าใจคำถามของคุณถูกต้องคุณมีข้อมูลที่ไม่ได้เป็นส่วนหนึ่งของที่อยู่ลูกค้า แต่คุณต้องส่งไปที่แบ็กเอนด์ด้วย คำตอบสำหรับคำถามนี้คือ:
มันขึ้นอยู่กับ ตัวอย่างเช่นคุณสามารถเลือกวิธีการต่อไปนี้: เพิ่มแบบฟอร์มที่กำหนดเองไปยังหน้าเช็คเอาต์ที่มีเขตข้อมูลพิเศษทั้งหมดของคุณ (like comment, invoice request etc)เพิ่มตรรกะ JS ที่จะจัดการรูปแบบนี้ขึ้นอยู่กับเหตุการณ์บางอย่างและให้บริการที่กำหนดเองที่จะได้รับข้อมูลจากส่วนหน้าและร้านค้า เพื่อใช้ในอนาคต
เอกสารทั้งหมดอย่างเป็นทางการที่เกี่ยวข้องกับการเช็คเอาต์ตั้งอยู่ที่http://devdocs.magento.com/guides/v2.1/howdoi/checkout/checkout_overview.html คำว่าสแตติกหมายถึงรูปแบบที่เขตข้อมูลทั้งหมดเป็นที่รู้จัก / กำหนดไว้ล่วงหน้าแล้ว (ตัวอย่างเช่น: แบบฟอร์มจะมี 2 ฟิลด์ข้อความที่มีป้ายกำกับที่กำหนดไว้ล่วงหน้าเสมอ) และไม่สามารถเปลี่ยนแปลงได้ตามการตั้งค่าบางอย่างในแบ็กเอนด์
layout XML configurationรูปแบบดังกล่าวสามารถประกาศใช้ ในทางตรงกันข้ามคำไดนามิกหมายถึงรูปแบบที่ชุดของฟิลด์สามารถเปลี่ยนได้ (ตัวอย่างเช่น: แบบฟอร์มเช็คเอาต์สามารถมีฟิลด์มากขึ้น / น้อยลงตามการตั้งค่าการกำหนดค่า)
ในกรณีนี้วิธีเดียวที่จะประกาศฟอร์มดังกล่าวคือการใช้LayoutProcessorปลั๊กอิน
:) วีโอไอพีพยายามที่จะครอบคลุมกรณีการใช้งานที่เป็นไปได้มากที่สุดซึ่งอาจสำคัญต่อผู้ค้าระหว่างการใช้ / ปรับแต่งวีโอไอพีให้ได้มากที่สุด บางครั้งสิ่งนี้นำไปสู่สถานการณ์เมื่อบางกรณีใช้งานง่ายกลายเป็นความซับซ้อนมากขึ้น
หวังว่านี่จะช่วยได้
================================================== =======================
ตกลง ... ให้เขียนโค้ด;)
- โค้ด PHP ที่แทรกฟิลด์เพิ่มเติมใน LayoutProcessor
========
/**
* @author aakimov
*/
$customAttributeCode = 'custom_field';
$customField = [
'component' => 'Magento_Ui/js/form/element/abstract',
'config' => [
// customScope is used to group elements within a single form (e.g. they can be validated separately)
'customScope' => 'shippingAddress.custom_attributes',
'customEntry' => null,
'template' => 'ui/form/field',
'elementTmpl' => 'ui/form/element/input',
'tooltip' => [
'description' => 'Yes, this works. I tested it. Sacrificed my lunch break but verified this approach.',
],
],
'dataScope' => 'shippingAddress.custom_attributes' . '.' . $customAttributeCode,
'label' => 'Custom Attribute',
'provider' => 'checkoutProvider',
'sortOrder' => 0,
'validation' => [
'required-entry' => true
],
'options' => [],
'filterBy' => null,
'customEntry' => null,
'visible' => true,
];
$jsLayout['components']['checkout']['children']['steps']['children']['shipping-step']['children']['shippingAddress']['children']['shipping-address-fieldset']['children'][$customAttributeCode] = $customField;
return $jsLayout;
ดังที่ฉันได้กล่าวไปแล้วสิ่งนี้จะเพิ่มเขตข้อมูลของคุณไปยังcustomAttributesคุณสมบัติของวัตถุที่อยู่ JS คุณสมบัตินี้ได้รับการออกแบบเพื่อให้มีที่อยู่ EAV ที่กำหนดเองและเกี่ยวข้องกับ\Magento\Quote\Model\Quote\Address\CustomAttributeListInterface::getAttributesวิธีการ
รหัสด้านบนจะจัดการการเก็บรักษาข้อมูลในเครื่องโดยอัตโนมัติในส่วนหน้า คุณจะได้รับค่าเขตข้อมูลของคุณจากการจัดเก็บในท้องถิ่นใช้checkoutData.getShippingAddressFromData()(ที่checkoutDataเป็นMagento_Checkout/js/checkout-data)
- เพิ่มมิกซ์อินเพื่อเปลี่ยนพฤติกรรมของ 'Magento_Checkout / js / action / set-shipping-information' (ส่วนประกอบนี้มีหน้าที่รับผิดชอบในการส่งข้อมูลระหว่างขั้นตอนการจัดส่งและการชำระเงินในการเรียกเก็บเงิน)
========
2.1 สร้างyour_module_name/view/frontend/requirejs-config.js
/**
* @author aakimov
*/
var config = {
config: {
mixins: {
'Magento_Checkout/js/action/set-shipping-information': {
'<your_module_name>/js/action/set-shipping-information-mixin': true
}
}
}
};
2.2 สร้าง your_module_name / view / frontend / web / js / action / set-shipping-data-mixin.js
/**
* @author aakimov
*/
/*jshint browser:true jquery:true*/
/*global alert*/
define([
'jquery',
'mage/utils/wrapper',
'Magento_Checkout/js/model/quote'
], function ($, wrapper, quote) {
'use strict';
return function (setShippingInformationAction) {
return wrapper.wrap(setShippingInformationAction, function (originalAction) {
var shippingAddress = quote.shippingAddress();
if (shippingAddress['extension_attributes'] === undefined) {
shippingAddress['extension_attributes'] = {};
}
// you can extract value of extension attribute from any place (in this example I use customAttributes approach)
shippingAddress['extension_attributes']['custom_field'] = shippingAddress.customAttributes['custom_field'];
// pass execution to original action ('Magento_Checkout/js/action/set-shipping-information')
return originalAction();
});
};
});
- สร้าง your_module_name / etc / extension_attributes.xml
========
<?xml version="1.0"?>
<!--
/**
* @author aakimov
*/
-->
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Api/etc/extension_attributes.xsd">
<extension_attributes for="Magento\Quote\Api\Data\AddressInterface">
<attribute code="custom_field" type="string" />
</extension_attributes>
</config>
สิ่งนี้จะเพิ่มแอททริบิวต์ส่วนขยายลงในโมเดลที่อยู่ทางด้านหลัง แอตทริบิวต์ส่วนขยายเป็นหนึ่งในจุดส่วนขยายที่ Magento ให้ไว้ ในการเข้าถึงข้อมูลของคุณในแบ็กเอนด์คุณสามารถใช้:
// Magento will generate interface that includes your custom attribute
$value = $address->getExtensionAttributes()->getCustomField();
หวังว่านี้จะช่วยและจะถูกเพิ่มลงในเอกสารอย่างเป็นทางการ