W3Cschool
恭喜您成為首批注冊(cè)用戶(hù)
獲得88經(jīng)驗(yàn)值獎(jiǎng)勵(lì)
單行文本可用于錄入數(shù)字,比如身份證號(hào)、手機(jī)號(hào)、學(xué)號(hào)、員工編號(hào)、銀行卡號(hào)、會(huì)員號(hào)等;也可只輸入普通的文字。
https://www.yuque.com/yida/support/snftao
擁有掃碼、格式校驗(yàn)、計(jì)數(shù)器、一鍵清除、高級(jí)功能頁(yè)面跳轉(zhuǎn)等功能。
我們可以調(diào)用釘釘?shù)膾叽a功能,快速將二維碼/條形碼的消息錄入給單行文本組件。
常用于設(shè)備巡查、資產(chǎn)盤(pán)點(diǎn)等需要掃碼輸入的場(chǎng)景。
掃碼模式
效果如圖:
注:該模式僅在釘釘手機(jī)端內(nèi)支持,開(kāi)啟后,如果在不支持的環(huán)境下,點(diǎn)擊掃碼會(huì)出現(xiàn)提示需要在釘釘端內(nèi)打開(kāi),不會(huì)影響到組件的基礎(chǔ)使用。
掃碼類(lèi)型支持: 全部 、 僅二維碼 、 僅條形碼
全部:一個(gè)控件既可以識(shí)別 二維碼 又可以識(shí)別 條形碼
支持從相冊(cè)選擇圖片進(jìn)行識(shí)別
掃碼識(shí)別到的信息支持修改,如果開(kāi)啟了不允許修改掃碼結(jié)果的按鈕,則無(wú)法對(duì)掃碼后的結(jié)果進(jìn)行修改
如圖設(shè)置:
支持設(shè)置文本格式:身份證、手機(jī)號(hào)碼、郵箱、網(wǎng)址、以及密碼。
1)手機(jī)號(hào):可錄入 11 位數(shù)的手機(jī)號(hào)碼,格式會(huì)驗(yàn)證 1 開(kāi)頭的 11 位數(shù)字。
2)身份證:當(dāng)需要收集身份證號(hào)碼時(shí),可設(shè)置控件為身份證格式。
身份證校驗(yàn)規(guī)則:
①長(zhǎng)度為 18,前 17 位為自然數(shù)字。
②最后一位可以是數(shù)字、也可以是字母X,如最后一位是除 X 之外的其他字母,則不符合身份證校驗(yàn)。
3)郵箱:當(dāng)需要收集郵箱信息時(shí),可以開(kāi)啟郵箱格式,參考格式:xxx@xxx.com
4)密碼:開(kāi)啟密碼格式后,填寫(xiě)頁(yè)面展示會(huì)是保密狀態(tài)。
5)網(wǎng)址:當(dāng)需要錄入網(wǎng)址時(shí),可開(kāi)啟網(wǎng)址格式,系統(tǒng)會(huì)進(jìn)行校驗(yàn)網(wǎng)址。
組件格式
開(kāi)啟計(jì)數(shù)器后,可設(shè)置該組件的字?jǐn)?shù)上限,超出設(shè)置的字?jǐn)?shù)上限后,會(huì)進(jìn)行校驗(yàn)提示。
效果如圖:
勾選顯示清除按鈕后,在訪(fǎng)問(wèn)/預(yù)覽頁(yè)面如輸入內(nèi)容有誤,可直接使用清除按鈕一鍵清除。
效果如圖:
通過(guò)掃描二維碼/條形碼所獲取到的信息,可以拼接鏈接,然后進(jìn)行頁(yè)面跳轉(zhuǎn)
例如:掃碼查看商品詳情,掃碼訂餐這種場(chǎng)景等可適用
效果如圖:
路徑:?jiǎn)涡形谋?>> 高級(jí) >> 新建動(dòng)作配置一個(gè)固定地址鏈接
舉例:新建動(dòng)作寫(xiě) js 時(shí),我們可以配置一個(gè)固定的地址鏈接,當(dāng)掃碼成功后,頁(yè)面獲取到的信息可作為鏈接參數(shù),跳轉(zhuǎn)到事先設(shè)置好的固定地址鏈接里去查看詳情,實(shí)現(xiàn)掃碼成功后自動(dòng)跳轉(zhuǎn)頁(yè)面的功能。
參考設(shè)置圖片如下:
注:代碼中的紅框位置要改成和右側(cè)唯一標(biāo)識(shí)一致的信息
唯一標(biāo)識(shí):類(lèi)似每個(gè)控件的身份證 每個(gè)控件的唯一標(biāo)識(shí)是不一樣的
可粘貼參考使用的 js 代碼信息:
export function onScanCodeSuccess(text) { const fieldId = 'editorField_klbopk6r'; // 如果不是 http 或者 https 開(kāi)頭的話(huà),不顯示下方文本。 if (!/^http(s)/.test(text)) { this.$(fieldId).setValue(null); return text; } const html = `<div><span style="color: #0089ff;"><a style="color: #0089ff;" href="${text}" target="_blank">點(diǎn)擊查看溯源單</a></span></div>`; // 賦值 this.$(fieldId).setValue(html); // 注意,onScanCodeSuccess 事件要 return text 回去,不然回填會(huì)有問(wèn)題 return text; }
請(qǐng) 點(diǎn)此 查看詳細(xì)操作說(shuō)明。
Copyright©2021 w3cschool編程獅|閩ICP備15016281號(hào)-3|閩公網(wǎng)安備35020302033924號(hào)
違法和不良信息舉報(bào)電話(huà):173-0602-2364|舉報(bào)郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號(hào)
聯(lián)系方式:
更多建議: