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 相关文章推荐
解析js如何获取当前url中的参数值并复制给input
Jun 23 Javascript
javascript中兼容主流浏览器的动态生成iframe方法
May 05 Javascript
JQuery1.8 判断元素是否绑定事件的方法
Jul 10 Javascript
JS实现向表格中动态添加行的方法
Mar 30 Javascript
在AngularJS中使用jQuery的zTree插件的方法
Apr 21 Javascript
Javascript动画效果(2)
Oct 11 Javascript
jQuery实现定时隐藏对话框的方法分析
Feb 12 jQuery
Vue核心概念Getter的使用方法
Jan 18 Javascript
详解ES6 CLASS在微信小程序中的应用实例
Apr 24 Javascript
Javascript实现秒表计时游戏
May 27 Javascript
Vue登录拦截 登录后继续跳转指定页面的操作
Aug 04 Javascript
Openlayers3实现车辆轨迹回放功能
Sep 29 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
mysql5详细安装教程
2007/01/15 PHP
php 将字符串按大写字母分隔成字符串数组
2010/04/30 PHP
php radio 单选框获取与保持值的实现代码
2010/05/15 PHP
PHP中文件缓存转内存缓存的方法
2011/12/06 PHP
php+ajax做仿百度搜索下拉自动提示框(有实例)
2012/08/21 PHP
php inc文件使用的风险和注意事项
2013/11/12 PHP
jQuery模拟超链接点击效果代码
2013/04/21 Javascript
『jQuery』名称冲突使用noConflict方法解决
2013/04/22 Javascript
setTimeout()与setInterval()方法区别介绍
2013/12/24 Javascript
JavaScript中的this到底是什么(一)
2015/12/09 Javascript
js发送短信倒计时的简单实现方法
2016/09/08 Javascript
BootStrap入门教程(三)之响应式原理
2016/09/19 Javascript
深入理解jquery中的each用法
2016/12/14 Javascript
JavaScript函数表达式详解及实例
2017/05/05 Javascript
在Js页面通过POST传递参数跳转到新页面详解
2017/08/25 Javascript
vue-cli脚手架搭建的项目去除eslint验证的方法
2018/09/29 Javascript
浅谈Vue数据响应
2018/11/05 Javascript
vue插件mescroll.js实现移动端上拉加载和下拉刷新
2019/03/07 Javascript
Vue使用NProgress的操作过程解析
2019/10/10 Javascript
js实现扫雷源代码
2020/11/27 Javascript
python实现控制台打印的方法
2019/01/12 Python
详解用python实现基本的学生管理系统(文件存储版)(python3)
2019/04/25 Python
Python脚本利用adb进行手机控制的方法
2019/07/08 Python
浅谈Python协程
2020/06/17 Python
python里glob模块知识点总结
2021/01/05 Python
css背景图片的背景裁切、背景透明度、背景变换等效果运用
2012/12/24 HTML / CSS
全球知名旅游社区巴西站点:TripAdvisor巴西
2016/07/21 全球购物
澳大利亚音乐商店:Bava’s Music City
2019/05/05 全球购物
美国豪华的多品牌精品店:The Webster
2019/07/31 全球购物
曼城官方网上商店:Manchester City
2019/09/10 全球购物
JAVA和C++区别都有哪些
2015/03/30 面试题
小学新学期寄语
2014/04/02 职场文书
咖啡店创业计划书范文
2014/09/15 职场文书
临床医学生职业规划书范文
2014/10/25 职场文书
长城的导游词
2015/01/30 职场文书
企业财务经理岗位职责
2015/04/08 职场文书