欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

VUE項目去除input 框值所有空格的操作方法

 更新時間：2022年10月26日 10:05:25   作者：行動很重要沖沖沖  
這篇文章主要介紹了VUE項目去除input 框值所有空格的操作方法，主要包括去除空格的方法、正則和element ui寫法，本文給大家講解的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下

去除空格的方法

str.trim(); //去掉首尾空格
str.replace(" ",""); //去除所有空格，包括首尾、中間
str.replaceAll(" ", ""); //去掉所有空格，包括首尾、中間
str.replaceAll(" +","");  //去掉所有空格，包括首尾、中間
str.replaceAll("\\s*", ""); //可以替換大部分空白字符， 不限于空格

正則：

str.replace(/\s*/g,"")
str.replace(/\ +/g, "");    // 去除 空格
str.replace(/[\r\n]/g, "");    // 去除 換行符
str.trim(); // 去除 前后空格

element ui 寫法

username: [
      { required: true, message: '請輸入用戶名', transform: value => value ? value.trim() : '', trigger: 'blur' },
      { required: true, max: 10, message: '請輸入10位以內字符', trigger: 'blur' }
    ],

一般如果是輸入框的話，直接禁用空格即可，我們已知的可能是直接調用trim方法即可，但是在使用element ui 時，可以直接在輸入框上設置trim，會比提交后再調用trim方法實用的多

<el-input v-model.trim="value"></el-input>

如上圖所示，直接在v-model上加trim輸入框就無法輸入空格了

當然如果非要用正則方式去去除空格也是可以的

clearBlank(value){
    if(value){
        value = value.replace(/\s/g,"")
    }
    return value
}

VUE 項目 去除 input 框值 所有空格、vue 組件去除空格、input 去除空格

1.以下所有方法 我都試過：不行。

str.trim(); //去掉首尾空格
str.replace(" ",""); //去除所有空格，包括首尾、中間
str.replaceAll(" ", ""); //去掉所有空格，包括首尾、中間
str.replaceAll(" +",""); ?//去掉所有空格，包括首尾、中間
str.replaceAll("\\s*", ""); //可以替換大部分空白字符， 不限于空格 ；

2. 改用正則： 

str.replace(/\s*/g,"")

運行成功，特別記錄下下。 

--------------------------------- 我是傻傻的分隔線 -----------------------------------------

2019.5.9 補充：

str.replace(/\ +/g, ""); ? ?// 去除 空格
str.replace(/[\r\n]/g, ""); ? ?// 去除 換行符
str.trim(); // 去除 前后空格

到此這篇關于VUE 項目去除 input 框值所有空格的文章就介紹到這了,更多相關vue去除空格內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

相關文章

  • Vue腳手架的簡單使用實例

    Vue腳手架的簡單使用實例

    這篇文章主要介紹了Vue腳手架的簡單使用實例，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
    2018-07-07
  • vue中的Router基本配置命令實例詳解

    vue中的Router基本配置命令實例詳解

    Vue的Router是一個用于實現頁面跳轉和路由管理的插件,它可以幫助我們根據不同的URL請求加載不同的組件,以及實現前端路由功能,本文給大家介紹vue中的Router基本配置命令,感興趣的朋友跟隨小編一起看看吧
    2024-02-02
  • 如何使用Vue+Element做個個人中心

    如何使用Vue+Element做個個人中心

    我們在做了用戶登錄后,就會讓用戶跳轉到個人中心,下面這篇文章主要給大家介紹了關于如何使用Vue+Element做個個人中心的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下
    2022-06-06
  • Vue之beforeEach非登錄不能訪問的實現（代碼親測）

    Vue之beforeEach非登錄不能訪問的實現（代碼親測）

    這篇文章主要介紹了Vue之beforeEach非登錄不能訪問的實現，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
    2019-07-07
  • 策略模式實現 Vue 動態(tài)表單驗證的方法

    策略模式實現 Vue 動態(tài)表單驗證的方法

    策略模式（Strategy Pattern）又稱政策模式，其定義一系列的算法，把它們一個個封裝起來，并且使它們可以互相替換。封裝的策略算法一般是獨立的，策略模式根據輸入來調整采用哪個算法。這篇文章主要介紹了策略模式實現 Vue 動態(tài)表單驗證,需要的朋友可以參考下
    2019-09-09
  • ResizeObserver?loop?limit?exceeded報錯原因及解決方案

    ResizeObserver?loop?limit?exceeded報錯原因及解決方案

    這篇文章主要給大家介紹了關于ResizeObserver?loop?limit?exceeded報錯原因及解決的相關資料,公司項目監(jiān)聽系統(tǒng)中發(fā)現一個高頻錯誤ResizeObserver loop limit exceeded,而瀏覽器的console中卻沒有提示,需要的朋友可以參考下
    2023-09-09
  • 如何運行單個.vue文件問題

    如何運行單個.vue文件問題

    本文介紹了Vue的全局安裝過程、查看版本、安裝擴展等步驟,并提供了解決在.vue文件目錄下運行報錯的方法,涉及到的錯誤解決包括使用命令安裝@vue/compiler-sfc和執(zhí)行npm install命令安裝依賴
    2024-10-10
  • 淺談Vue數據響應

    淺談Vue數據響應

    這篇文章主要介紹了淺談Vue數據響應，Vue的數據響應主要是依賴了Object.defineProperty()，下面就具體來介紹一下如何實現數據響應
    2018-11-11
  • Vue3中Element-Plus分頁(Pagination)組件的使用

    Vue3中Element-Plus分頁(Pagination)組件的使用

    Element-Plus分頁(Pagination)組件在開發(fā)過程中數據展示會經常使用到,同時分頁功能也會添加到頁面中,下面我們就來學習一下它的具體使用,需要的可以參考一下
    2023-11-11
  • 關于axios如何全局注冊淺析

    關于axios如何全局注冊淺析

    這篇文章主要給大家介紹了關于axios如何全局注冊的相關資料，文中通過示例代碼介紹的非常詳細，對大家學習或者使用axios具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧。
    2018-01-01

最新評論