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 html5 视频播放控制代码
Nov 06 Javascript
新闻上下滚动jquery 超简洁(必看篇)
Jan 21 Javascript
基于JS实现二维码图片固定在右下角某处并跟随滚动条滚动
Feb 08 Javascript
vue+vuecli+webpack中使用mockjs模拟后端数据的示例
Oct 24 Javascript
利用10行js代码实现上下滚动公告效果
Dec 08 Javascript
使用 vue.js 构建大型单页应用
Feb 10 Javascript
js 数组详细操作方法及解析合集
Jun 01 Javascript
vue通过滚动行为实现从列表到详情,返回列表原位置的方法
Aug 31 Javascript
javascript简单实现深浅拷贝过程详解
Oct 08 Javascript
jQuery实现小火箭返回顶部特效
Feb 03 jQuery
微信小程序获取公众号文章列表及显示文章的示例代码
Mar 10 Javascript
小程序实现可拖动的悬浮按钮
Sep 07 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的面试题集,附我的答案和分析(一)
2006/11/19 PHP
php设计模式 FlyWeight (享元模式)
2011/06/26 PHP
如何使用PHP批量去除文件UTF8 BOM信息
2013/08/05 PHP
浅谈PHP检查数组中是否存在某个值 in_array 函数
2016/06/13 PHP
jquery UI 1.72 之datepicker
2009/12/29 Javascript
JavaScript 数组运用实现代码
2010/04/13 Javascript
JavaScript中获取元素索引的函数
2010/09/10 Javascript
javascript控制台详解
2015/06/25 Javascript
PhantomJS快速入门教程(服务器端的 JavaScript API 的 WebKit)
2015/08/06 Javascript
js实现简洁的滑动门菜单(选项卡)效果代码
2015/09/04 Javascript
JS产生随机数的几个用法详解
2016/06/22 Javascript
详解AngularJS如何实现跨域请求
2016/08/22 Javascript
Angular 中 select指令用法详解
2016/09/29 Javascript
微信小程序(六):列表上拉加载下拉刷新示例
2017/01/13 Javascript
浅析JavaScript中var that=this
2017/02/17 Javascript
Vue2 使用 Echarts 创建图表实例代码
2017/05/18 Javascript
javascript ES6 新增了let命令使用介绍
2017/07/07 Javascript
使用wxapp-img-loader自定义组件实现微信小程序图片预加载功能
2018/10/18 Javascript
bootstrap datepicker的基本使用教程
2019/07/09 Javascript
基于Vue实现微前端的示例代码
2020/04/24 Javascript
Node 模块原理与用法详解
2020/05/13 Javascript
如何利用javascript接收json信息并进行处理
2020/08/06 Javascript
Python实现在线音乐播放器
2017/03/03 Python
Python实现输出某区间范围内全部素数的方法
2018/05/02 Python
Pytorch实现神经网络的分类方式
2020/01/08 Python
Django --Xadmin 判断登录者身份实例
2020/07/03 Python
python基于pygame实现飞机大作战小游戏
2020/11/19 Python
小学生考试获奖感言
2014/01/30 职场文书
2014年国庆标语
2014/06/30 职场文书
三八妇女节标语
2014/10/09 职场文书
党员学习新党章思想汇报
2014/10/25 职场文书
大学生自荐书范文
2015/03/05 职场文书
教师“一帮一”结对子活动总结
2015/05/07 职场文书
2015年学校总务处工作总结
2015/05/19 职场文书
会议开幕致辞怎么写
2016/03/03 职场文书
零基础学java之带返回值的方法的定义和调用
2022/04/10 Java/Android