日韩成人免费在线_国产成人一二_精品国产免费人成电影在线观..._日本一区二区三区久久久久久久久不

當前位置:首頁 > 科技  > 軟件

為了關閉全局 Input 的自動拼寫校驗!走了好多彎路

來源: 責編: 時間:2024-06-11 17:53:04 269觀看
導讀自動校驗注:以下輸入框包含input、textarea。事情是這樣的,上個星期,接到了一個需求,要求去除掉項目中的輸入框的自動拼寫檢查功能,也就是下圖出現的紅線,這個檢查是瀏覽器自帶的。解決方法其實是有解決方法的,而且也不難,很

自動校驗

注:以下輸入框包含input、textarea。XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

事情是這樣的,上個星期,接到了一個需求,要求去除掉項目中的輸入框的自動拼寫檢查功能,也就是下圖出現的紅線,這個檢查是瀏覽器自帶的。XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

解決方法

其實是有解決方法的,而且也不難,很簡單,只需要在輸入框標簽上加上一個屬性spellcheck=false即可,也就是:XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

解決思路

但是問題來了,我需要給全局的輸入框標簽都加上才行,由于本項目是使用了antd-design這個組件庫,那我們來看看整個項目都有哪些組件包含了輸入框標簽呢?XMK28資訊網——每日最新資訊28at.com

  • Input:包含input
  • Select:包含input
  • InputNumber:包含input
  • Textarea:包含textarea
  • body:直接在 body 上加 spellcheck="true"

多種解決方法

1.ConfigProvider

XMK28資訊網——每日最新資訊28at.com

ant-design官方提供了一個組件,可以用來為全局的組件進行統一配置,這個組件可以傳入一個input的參數,即可配置全局的Input標簽XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

也就是:XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

由于這個配置只針對全局的Input,所以結果都有哪些組件成功去掉了拼寫校驗功能呢:XMK28資訊網——每日最新資訊28at.com

  • Input:?
  • Select:?
  • InputNumber:?
  • Textarea:?

2.修改defaultProps

大概的思路就是,修改ant-design的源碼中的input這一部分,給Input、Textarea這些組件加上一個defaultProps,這個defaultProps長這樣:XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

所以具體實現為以下代碼:XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

結果就是,全局的Input、Textarea都去除了拼接檢查了,但是Select、InputNumber卻沒有去除,因為他們是依賴了RCSelect、RCInputNumber這兩個另外的組件,所以想改這兩個,就得去改他們兩依賴的組件,所以結果就是:XMK28資訊網——每日最新資訊28at.com

  • Input:?
  • Select:?
  • InputNumber:?
  • Textarea:?

3.攔截React.createElement

我們都知道在React中,只要涉及到JSX語法,最終在解析時都會通過React.createElement方法來創建標簽:XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

所以思路就是在最終調用React.createElement時,判斷如果是input、textarea這兩個類型的話,就給標簽加上spellCheck: false這個屬性,具體代碼為:XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

這樣做的結果是:XMK28資訊網——每日最新資訊28at.com

  • Input:?
  • Select:?
  • InputNumber:?
  • Textarea:?

但是總是覺得直接涉及到React自帶方法的修改,有點不太好。。XMK28資訊網——每日最新資訊28at.com

4.全局監聽input事件

思路就是全局監聽input這個事件,并在這個事件里去給觸發事件的DOM節點增加spellCheck: false,具體代碼為:XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

這樣做的結果是:XMK28資訊網——每日最新資訊28at.com

  • Input:?
  • Select:?
  • InputNumber:?
  • Textarea:?

5.MutationObserver

兼容性比較差,所以不考慮了吧~~~XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

6.body 直接加 spellcheck="true"

哎。。。都怪沒有好好看文檔。。。其實前面做的都是無用功,最方便的做法是直接在 body 上加 spellcheck="false" 就行了,底下的后代元素會自動繼承這個屬性值。。XMK28資訊網——每日最新資訊28at.com

圖片XMK28資訊網——每日最新資訊28at.com

XMK28資訊網——每日最新資訊28at.com

本文鏈接:http://m.www897cc.com/showinfo-26-93094-0.html為了關閉全局 Input 的自動拼寫校驗!走了好多彎路

聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。郵件:2376512515@qq.com

上一篇: 多線程編程在 C# 中的基礎概念與實現

下一篇: 使用React和GraphQL進行CRUD:完整教程與示例

標簽:
  • 熱門焦點
Top 日韩成人免费在线_国产成人一二_精品国产免费人成电影在线观..._日本一区二区三区久久久久久久久不
亚洲国产成人高清精品| 国产精品一区二区三区免费观看| 欧美在线在线| 午夜精品www| 亚洲欧美视频在线| 欧美一级欧美一级在线播放| 先锋资源久久| 久久久久久国产精品mv| 久久野战av| 久久躁日日躁aaaaxxxx| 免费亚洲一区二区| 欧美理论大片| 国产精品久久久久久久app| 国产精品一区二区三区久久| 韩国一区电影| 最新日韩欧美| 日韩天堂在线观看| 亚洲午夜高清视频| 欧美在线电影| 嫩草成人www欧美| 欧美日韩国产色站一区二区三区| 国产精品久久久久久久久| 国产一区二区三区在线观看免费视频 | 亚洲欧美另类国产| 久久成人精品| 欧美成人激情视频| 欧美日韩国产123| 国产精品女主播| 在线看欧美视频| 在线视频精品| 久久久综合精品| 另类亚洲自拍| 国产精品区一区二区三区| 国产精自产拍久久久久久| 在线成人性视频| 在线综合视频| 久久婷婷丁香| 国产精品久久久久国产a级| 国产一区二区三区免费在线观看 | 亚洲一区二区网站| 久久一区二区三区四区五区| 国产精品三级视频| 一级日韩一区在线观看| 欧美69wwwcom| 国产综合18久久久久久| 国产精品高潮在线| 一区二区三区在线免费观看| 99re6热只有精品免费观看| 欧美一区二区在线| 欧美日韩第一页| 激情成人中文字幕| 亚洲一区影院| 欧美激情四色| 国产一区二区三区的电影 | 国产精品卡一卡二| 亚洲国产网站| 欧美影片第一页| 欧美黄污视频| 国内精品亚洲| 午夜激情综合网| 欧美日本亚洲| 在线观看欧美成人| 欧美亚洲免费高清在线观看| 欧美日韩ab片| 亚洲国产一区二区三区高清 | 国产女优一区| 在线视频欧美精品| 久久久国产精品一区二区三区| 欧美三级在线| 亚洲激情在线激情| 久久综合久久美利坚合众国| 国产精品亚洲精品| 一区二区三区 在线观看视频| 久久免费视频在线观看| 国产精品yjizz| 日韩亚洲欧美一区| 老司机午夜精品视频在线观看| 国产精品自拍在线| 亚洲一级黄色| 国产毛片一区二区| 性欧美暴力猛交69hd| 国产拍揄自揄精品视频麻豆| 欧美一区二区在线| 国产一区二区三区久久久久久久久| 午夜宅男久久久| 国产精品久久久久久亚洲毛片| 亚洲国语精品自产拍在线观看| 久久中文在线| 极品av少妇一区二区| 久久精品成人一区二区三区| 国产欧美一区二区精品性色| 亚洲欧美卡通另类91av| 国产精品久久久久9999吃药| 在线一区二区三区四区| 欧美日韩1080p| 亚洲欧洲精品一区二区| 欧美xart系列在线观看| 激情成人av| 久久人人97超碰精品888| 国产主播一区二区三区| 久久精品夜夜夜夜久久| 欧美亚一区二区| 亚洲一区二区三区在线看| 国产精品国内视频| 亚洲欧美另类国产| 国产伦理一区| 亚洲欧美日韩成人高清在线一区| 国产精品久久久久7777婷婷| 亚洲毛片在线| 欧美色网在线| 亚洲一区二区成人| 国产精品天天摸av网| 欧美一区二区三区播放老司机| 一区二区三区在线看| 欧美精品亚洲一区二区在线播放| 亚洲午夜91| 怡红院精品视频| 欧美日韩在线不卡| 久久成人一区| 亚洲美女诱惑| 国产日韩欧美一区在线 | 亚洲精品美女久久久久| 欧美日韩国产专区| 亚洲综合国产精品| 国产亚洲成av人在线观看导航| 久久精品国产91精品亚洲| 韩国久久久久| 欧美国产精品中文字幕| 夜夜嗨一区二区三区| 国产精品视频久久| 久久久精品日韩| 欧美精品一线| 亚洲美女在线视频| 欧美日韩一本到| 欧美一级视频| 1024国产精品| 欧美日韩综合网| 久久久久久久精| 国产精品理论片| 久久嫩草精品久久久精品一| 亚洲精选视频免费看| 国产区日韩欧美| 欧美剧在线观看| 久久精品国产综合| 在线视频你懂得一区| 在线观看中文字幕不卡| 国产精品视频一区二区三区| 免费在线欧美黄色| 性色av一区二区三区在线观看| 亚洲娇小video精品| 国产一区二区av| 欧美日韩亚洲视频| 久久综合网络一区二区| 亚洲欧美视频| 一区二区三区精品久久久| 激情久久久久| 国产精品尤物| 欧美日韩一区二区在线| 牛牛国产精品| 久久成人免费| 亚洲欧美国产日韩天堂区| 亚洲精品资源| 136国产福利精品导航| 国产美女精品一区二区三区| 欧美日韩福利视频| 免费在线播放第一区高清av| 久久经典综合| 午夜久久电影网| 这里是久久伊人| 亚洲精品久久7777| 在线看视频不卡| 国产婷婷一区二区| 国产精品久久久久影院色老大 | 伊人成年综合电影网| 国产精品网曝门| 欧美日韩无遮挡| 欧美精品九九99久久| 噜噜噜在线观看免费视频日韩| 欧美一区二区三区免费看| 亚洲一区bb| 中文久久精品| 亚洲免费观看视频| 亚洲人成人99网站| 永久免费视频成人| 国产一区清纯| 国产日产欧产精品推荐色| 国产精品久久久久久久久久免费看 | 国产精品网曝门| 欧美日韩国产成人高清视频| 噜噜噜躁狠狠躁狠狠精品视频| 久久精品一区二区三区中文字幕| 午夜国产欧美理论在线播放| 亚洲午夜性刺激影院| 一区二区三区 在线观看视| 日韩视频国产视频| 亚洲精品国产精品久久清纯直播 | 久久九九久精品国产免费直播| 香蕉成人伊视频在线观看| 亚洲欧美激情一区| 亚洲一区二区三区色| 亚洲在线第一页| 欧美亚洲综合久久| 欧美一区二区三区男人的天堂| 午夜视频在线观看一区二区三区|