customers/addresses
customers/addresses 模板渲染了客户地址表单页面，该页面允许客户编辑他们的当前地址以及添加新的地址。
位置
customers/addresses 模板位于主题的 templates/customers 目录中：
└── theme
├── layout
├── templates
| └── customers
| ├── addresses.json
| ...
...
内容
你应该在 customers/addresses 模板或模板内的某个 section 中包含以下内容：
customer对象
你可以访问 Handlebars customer 对象以显示客户账户的详细信息。
标准的表单输入
在添加或编辑地址的表单中，每个地址详细信息都有标准表单输入。下表显示了每个输入字段及其相关的 type 和 name 属性。
如果你希望限制表单只接受你提供运送服务的地区提交的表单，那么你可以使用 country_option_tags 来构建你的国家/地区选择器。
如果你想需要返回所有国家/地区，那么你可以使用 all_country_option_tags。
| 字段 | 类型 | 表单name |
|---|---|---|
| First name | text | address[first_name] |
| Last name | text | address[last_name] |
| Company | text | address[company] |
| Address 1 | text | address[address1] |
| Address 2 | text | address[address2] |
| Country | select | address[country] |
| Province | select | address[province] |
| City code | select | address[city_code] |
| City | input | address[city] |
| District code | select | address[district_code] |
| District | input | address[district] |
| ZIP/Postal Code | text | address[zip] |
| Phone Number | text | address[phone] |
每个地址详细信息的表单输入必须具有此表中的 name 属性，否则表单将无法成功提交。
用法
使用 customers/addresses 模板时，您应该熟悉以下内容：
如果你使用的是 JSON templates，那么任何 HTML 或 Handlebars 代码都需要包含在模板引用的 section 中。
如何级联地址
你应该提供地址级联交互来引导用户输入完整的地址，地址数据通过 window.routes.address_url 提供的 API URL 进行获取。有关实例的实现，请参阅 Seed 中的 assets/component-address-cascade.js 文件：
class AddressCascade extends HTMLElement {
...other codes
createCityOptions() {
const countryName = this.countryEl.value;
const province = this.provinceEl.value;
return this.fetchAddressNextLevel({
countryName,
province,
}).then((response) => {
this.clearOptions(this.cityEl);
if (!response.data.length) {
this.cityContainer.style.display = 'none';
this.districtContainer.style.display = 'none';
this.clearOptions(this.districtEl);
return false;
}
response.data.forEach((city) => {
this.createOption(this.cityEl, {
value: city.code,
innerHTML: city.name,
});
});
this.cityContainer.style.display = '';
return true;
});
}
}
为了确保 SHOPLINE admin 后台能够完整显示用户的地址，需要补充以下输入逻辑：
- 当一个国家/地区下有省份时，显示一个下拉菜单，展示该国家/地区对应的省份和城市；
- 当一个国家/地区下没有省份时，显示城市和地区的输入框，支持用户输入城市和地区；
如何添加新地址
你可以使用 Handlebars form helper 以及相应的 customer_address 参数，允许客户添加新地址：
<!-- form content -->
在表单内部，你需要包含标准表单输入，以捕获各种地址详细信息。
编辑已有地址
在每个现有地址中，你应该包含一个表格来编辑它。你可以使用 Handlebars form helper 及相应的 customer_address 和 address 参数来添加这个表单：
<!-- form content -->
在表单内部，你需要包含标准表单输入，以捕获各种地址详细信息。
