地址

1. 地址組件

1.1 什么是地址組件

一款基于現(xiàn)在中國(guó)標(biāo)準(zhǔn)行政區(qū)塊的詳細(xì)地址選擇器

添加地址組件

1.2 使用場(chǎng)景

• 目前地址組件在移動(dòng)端有定位能力了，可以快速填充地址信息；同時(shí)允許重新編輯
• 如果要選取的地址信息，恰好是當(dāng)前所在位置區(qū)域時(shí)，可在移動(dòng)端（手機(jī)開啟了定位權(quán)限情況下）點(diǎn)擊定位圖標(biāo)，則地址信息可被快速填入，填入后可繼續(xù)重新編輯

• 常用于地址選擇場(chǎng)景，快遞收貨地址、辦事行政地區(qū)地址；
• 組件默認(rèn)已將中國(guó)當(dāng)前最新的 省/市/區(qū)（縣）/街道（鄉(xiāng)鎮(zhèn)）內(nèi)置在組件內(nèi)，直接添加地址組件即可使用；

2. 屬性

2.1 占位提示

• 類似標(biāo)準(zhǔn)輸入框的灰色占位符，可用于引導(dǎo)性文字提示。
• 若沒有填寫地址默認(rèn)值，占位提示則顯示，否則優(yōu)先地址默認(rèn)值內(nèi)容的顯示。

2.2 類型

• 地址詳細(xì)程度設(shè)置
• 選擇了詳細(xì)地址，會(huì)有兩行

• 未選擇詳細(xì)地址，只有一行，效果如圖：

選擇地址展示類型

2.3 組件的子標(biāo)題及提示內(nèi)容

選擇了詳細(xì)地址之后的，對(duì)于詳細(xì)地址輸入框的設(shè)置，效果如圖：

2.4 允許清空

指開啟允許清空開關(guān)后，在提交表單數(shù)據(jù)時(shí)可一鍵清除錄入的組件數(shù)據(jù)

2.5 需要該組件有默認(rèn)地址

• 可以在設(shè)計(jì)器右側(cè)，初始化一份默認(rèn)的地址信息
• 其中默認(rèn)值的詳細(xì)程度與類型中的選項(xiàng)自動(dòng)關(guān)聯(lián)

2.6 快速定位

• 移動(dòng)端支持定位能力，快速填充地址信息

2.6.1 使用場(chǎng)景

• 如果要選取的地址信息，恰好是當(dāng)前所在位置區(qū)域時(shí)，
• 可在移動(dòng)端（手機(jī)開啟了定位權(quán)限情況下）點(diǎn)擊定位圖標(biāo)，則地址信息可被快速填入，填入后可繼續(xù)重新編輯

2.6.2 效果示意

此處為語(yǔ)雀視頻卡片，點(diǎn)擊鏈接查看：

3. 高級(jí)

3.1 動(dòng)作設(shè)置

對(duì)于這個(gè)組件需要設(shè)置動(dòng)作 配置 JS 代碼時(shí)

路徑：點(diǎn)擊新建動(dòng)作 >> 值發(fā)生變化 >> 配置 JS 代碼，效果如圖：

配置 JS 代碼

4. 常見問題

4.1 目前地址組件顯示的是 XX 地點(diǎn)，但是想獲取經(jīng)緯度信息的話，是否有方法能實(shí)現(xiàn) ？

宜搭這邊暫時(shí)沒有定位經(jīng)緯度的功能，經(jīng)緯度信息之前在定位組件里會(huì)有，地址組件目前透出的是一個(gè)地區(qū)碼，經(jīng)緯度信息還獲取不到。

4.2 請(qǐng)問一下，地址控件的這個(gè)斜杠能否刪除掉？提取拼接在單行文本里的數(shù)據(jù)里把這個(gè)斜杠自動(dòng)刪除，包括使用 JS 能否實(shí)現(xiàn) ？

獲取到地區(qū)信息以后，通過 JS 處理結(jié)果，賦值給單行文本，可以去掉/

//參考代碼（綁定在地址組件上）
export function onChange({ value }, extra) {
  if (value.regionText) {
    let allAddress = '';
    value.regionText.map(el => {
      allAddress += el.zh_CN
    })
    allAddress += value.address
    this.$('textField_kr49k4ug').setValue(allAddress)
  }
}