私はあなたの質問に答えようとします。
いいえ。これは、配送先住所フォームにカスタム属性を追加する正しい方法ではありません。編集する必要はありませんnew-customer-address.js
。実際、このJSファイルはすべての事前定義されたアドレス属性をリストし、対応するバックエンドインターフェイスと一致します\Magento\Quote\Api\Data\AddressInterface
が、Magentoはバックエンド/フロントエンドコンポーネントを変更せずにカスタム属性をバックエンドに渡す機能を提供します。
上記の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
プラグインを使用することです。
:) Magentoは、Magentoの使用/カスタマイズ中に商人にとって重要となる可能性のあるユースケースを可能な限りカバーしようとします。これにより、いくつかの単純なユースケースがより複雑になる場合があります。
お役に立てれば。
================================================== =======================
OK ...いくつかのコードを書きましょう;)
- LayoutProcessorに追加フィールドを挿入するPHPコード
=========
/**
* @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
)を使用して、ローカルストレージからフィールド値を取得できます。
- mixinを追加して、 '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-information-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が提供する拡張ポイントの1つです。バックエンドでデータにアクセスするには、次を使用できます。
// Magento will generate interface that includes your custom attribute
$value = $address->getExtensionAttributes()->getCustomField();
これが役立って、公式文書に追加されることを願っています。