您现在的位置是:网站首页> 编程资料编程资料
Ant Design-vue 解决input前后空格问题(推荐)_vue.js_
2023-05-24
612人已围观
简介 Ant Design-vue 解决input前后空格问题(推荐)_vue.js_
需求:输入框不允许有前后空格但字符中间可以有空格

我这里是封装成全局自定义指令,如果同学要用的话根据自己需求放入对应文件即可
index.js
/* * @Author: 周云芳 164591357@qq.com * @Date: 2022-10-25 16:11:21 * @LastEditors: 周云芳 164591357@qq.com * @LastEditTime: 2022-10-25 16:43:46 * @FilePath: \zhhq-front-web\src\directive\input-trim\index.js * @Description: 解决input前后空格问题 */ /** * @description:解决input前后空格问题 * \s:空格 * \uFEFF:字节次序标记字符(Byte Order Mark),也就是BOM,它是es5新增的空白符 * \xA0:禁止自动换行空白符,相当于html中的 * @return {*} */ export default { inserted: (el, binding) => { setTimeout(() => { el.oninput = () => { el.value = el.value.replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '') } el.onblur = () => { el.value = el.value.replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '') } }, 100) } } Vue Element 去除input前后空格
在el-input中可以使用v-model.trim来去除内容中的前后空格
到此这篇关于Ant Design-vue 解决input前后空格问题的文章就介绍到这了,更多相关ant Design-vue空格input内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!
相关内容
- LayUI下拉树TreeSelect的使用解读_javascript技巧_
- LayUI—tree树形结构的使用解析_javascript技巧_
- LayUI树形表格treetable使用及说明_javascript技巧_
- layui table checked获取选中数据方式_javascript技巧_
- React可定制黑暗模式切换开关组件_React_
- 微信小程序tabBar组件切换与下拉刷新实现详解_javascript技巧_
- 可定制react18 input otp 一次性密码输入组件_React_
- 解决layui的table.checkStatus失效问题_javascript技巧_
- 适用于React Native 旋转木马应用程序介绍_React_
- 微信小程序使用uni-app实现首页搜索框导航栏功能详解_javascript技巧_
