PhoneField​

PhoneField 组件是一个带有区号的电话输入框。

预览​

示例代码​

render('Checkout::Dynamic::Render', () => {
  return <PhoneField label="Phone" value="1 (555) 555-5555" />;
});

PhoneFieldProps​

label​

字段标签，也被用作字段为空时的占位符。

accessibilityDescription?​

设置该组件的标签，将用于屏幕阅读器中帮助客户理解组件的功能。更多内容可见 Accessible description。

autocomplete?​

控制字段内容的提示是否显示。当设置为 true 时，表示该字段使用浏览器记录的内容进行自动填充。当设置为 false 时，表示永远不保存内容。注意在某些浏览器下自动填充功能无法保证默认关闭状态，因此不要过度依赖不传值时的默认表现。或者，你可以提供一个 Autocomplete 对象，配置你希望在此字段中输入的特定数据。

disabled?​

字段是否可以修改。true 为不可修改，false 为可修改。

error?​

向客户展示的错误信息。若配置该传参，组件将会标红显示，并展示错误信息。

icon?​

在字段的开始或结尾渲染的图标。默认情况下将在开始处呈现。

id?​

用于标识当前组件的唯一标识符。如果未设置 ID，则会使用全局唯一值，全局唯一值为组件内部自行创建的 ID。

maxLength?​

指定允许的最大字符数。

name?​

当前组件的名称标识。

readonly?​

是否只读。true 为只读，false 为可编辑。

required?​

字段是否需要值。true 为需要，false 为不需要。该字段旨在添加语义值，不会自动出现错误提示。如果要在该字段为空时显示错误，可以使用 error 属性。

value?​

字段的当前值。如果省略，该字段将为空。你应该根据 onChange 回调更新此值。

areaCode?​

指定区号。

defaultAreaCode?​

默认区号。

defaultValue?​

默认值。

onChange?​

当完成编辑字段或按下国家下拉列表时的回调。

onInput?​

当客户在字段中进行任何更改时（包括在下拉列表中选择国家）的回调。

onFocus?​

输入聚焦时的回调。

onBlur?​

移除焦点时的回调。

onKeyDown?​

点击键盘时的回调。

类型说明​

Autocomplete​

AutocompleteGroup​

AutocompleteField​

参考 autofill field。

IconSource​