vue用elementui写form表单时,在label里添加空格操作


Posted in Javascript onAugust 13, 2020

vue用elementui写form表单时,在label里添加空格操作

要在密码两字中间添加空格,发现直接添加  是识别不了的,正确写法为:

vue用elementui写form表单时,在label里添加空格操作

代码:

<el-form-item label="密 码:" :label-width="formLabelWidth" prop="password">
   <label slot="label">密    码:</label>
   <el-input
    type="password"
    v-model="FormData.password"
    placeholder="请输入密码"
    autocomplete="off"
    show-password
   ></el-input>
   </el-form-item>

补充知识:vue + elementUI 给input输入框添加 字体小图标

基于vue框架,使用element-ui组件库写表单效果,需要添加字体小图标,效果如下:

vue用elementui写form表单时,在label里添加空格操作

1.只需要添加prefix-icon="iconfont icon-xxx"即可(头部插入)

//例如
<el-input 
 prefix-icon="iconfont icon-sousuo" 
 v-model="searchTableInfo" 
 placeholder="请输入姓名" 
 style="width:240px"
></el-input>

2.添加suffix-icon=“iconfont icon-xxx”(尾部添加)

//例如
<el-input 
 suffix-icon="iconfont icon-sousuo" 
 v-model="searchTableInfo" 
 placeholder="请输入姓名" 
 style="width:240px"
></el-input>

以上这篇vue用elementui写form表单时,在label里添加空格操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery Div中加载其他页面的实现代码
Feb 27 Javascript
Prototype Array对象 学习
Jul 19 Javascript
下拉列表选择项的选中在不同浏览器中的兼容性问题探讨
Sep 18 Javascript
jquery单行文字向上滚动效果的实现代码
Sep 05 Javascript
Javascript学习笔记之数组的构造函数
Nov 23 Javascript
Underscore.js 1.3.3 中文注释翻译说明
Jun 25 Javascript
基于jQuery实现文本框只能输入数字(小数、整数)
Jan 14 Javascript
jQuery通用的全局遍历方法$.each()用法实例
Jul 04 Javascript
详解AngularJS 过滤器的使用
Jun 02 Javascript
cnpm加速Angular项目创建的方法
Sep 07 Javascript
angular4自定义表单控件[(ngModel)]的实现
Nov 23 Javascript
element-ui table行点击获取行索引(index)并利用索引更换行顺序
Feb 27 Javascript
jQuery中event.target和this的区别详解
Aug 13 #jQuery
在Vue 中获取下拉框的文本及选项值操作
Aug 13 #Javascript
vue自动添加浏览器兼容前后缀操作
Aug 13 #Javascript
Postman参数化实现过程及原理解析
Aug 13 #Javascript
vue 接口请求地址前缀本地开发和线上开发设置方式
Aug 13 #Javascript
vue路由分文件拆分管理详解
Aug 13 #Javascript
Postman环境变量全局变量使用方法详解
Aug 13 #Javascript
You might like
PHP去掉从word直接粘贴过来的没有用格式的函数
2012/10/29 PHP
DOM XPATH获取img src值的query
2013/09/23 PHP
thinkPHP查询方式小结
2016/01/09 PHP
浅谈PHP eval()函数定义和用法
2016/06/21 PHP
学习PHP Cookie处理函数
2016/08/09 PHP
如何直接访问php实例对象中的private属性详解
2017/10/12 PHP
js捕获鼠标右键菜单中的粘帖事件实现代码
2013/04/01 Javascript
js工具方法弹出蒙版
2013/05/08 Javascript
HTML5之lang属性与dir属性的详解
2013/06/19 Javascript
判断ie的两种简单方法
2013/08/12 Javascript
javascript动态判断html元素并执行不同的操作
2014/06/16 Javascript
兼容最新firefox、chrome和IE的javascript图片预览实现代码
2014/08/08 Javascript
JavaScript Sort 的一个错误用法示例
2015/03/20 Javascript
JavaScript 匿名函数和闭包介绍
2015/04/13 Javascript
jQuery validate插件submitHandler提交导致死循环解决方法
2016/01/21 Javascript
Vue.js常用指令的使用小结
2017/06/23 Javascript
layer.open弹层查看缩略图的原图,自适应大小的实例
2019/09/05 Javascript
vue按需加载实例详解
2019/09/06 Javascript
vue cli3 配置proxy代理无效的解决
2019/10/30 Javascript
详解一些适用于Node.js的命名约定
2019/12/08 Javascript
vue项目启动出现cannot GET /服务错误的解决方法
2020/04/26 Javascript
更改Ubuntu默认python版本的两种方法python-&gt; Anaconda
2016/12/18 Python
浅析使用Python操作文件
2017/07/31 Python
Python通过matplotlib绘制动画简单实例
2017/12/13 Python
Python中一个for循环循环多个变量的示例
2019/07/16 Python
python3实现从kafka获取数据,并解析为json格式,写入到mysql中
2019/12/23 Python
python 模拟登陆github的示例
2020/12/04 Python
详解HTML5 canvas绘图基本使用方法
2018/01/29 HTML / CSS
ECOSUSI官网:女式皮革背包
2019/09/27 全球购物
DTD的含义以及作用
2014/01/26 面试题
大学生学习自我评价
2014/01/13 职场文书
基督教婚礼主持词
2014/03/14 职场文书
中餐厅经理岗位职责
2014/04/11 职场文书
计算机软件专业求职信
2014/06/10 职场文书
学校安全教育月活动总结
2014/07/07 职场文书
青岛海底世界导游词
2015/02/11 职场文书