vue.js+element 默认提示中英文操作


Posted in Javascript onNovember 11, 2020

element默认中文版,但是我们在做英文页面时自己翻译很不爽,所以我们用element自带英文包,只要在html页面中引入就可以了,

具体引入方法有很多种,在此提供了我用过的一种,仅作为参考使用:

vue.js+element 默认提示中英文操作

补充知识:element-ui组价中表单的验证提示显示后台的提示信息及自定义提示

我在做这个的时候一个是分给我的那个页面 是有两个接口的,所以提示信息就是根据接口的response.success 提示 写一个提示语“XX已存在”如下:

html:

<el-form :model="form" :rules="rules" ref="form" label-width="110px" autocomplete="false"> 
<el-form-item label="商户名称" prop="name"> 
<el-input v-model="form.name" size="small" placeholder="请输入商户名称"></el-input> 
</el-form-item>
</el-form>

js:

写在data里面 ​

var judgeName = (rule, value, callback) =>{ 
    if(validateNull(value)){ 
   return callback(new Error("请输入商户名称"));
 
}else{
 
  repetitionName(this.form.id,this.form.name).then(response => { 
    if(response.success) { 
        if(response.data){ 
           return callback(new Error("商户名称已存在")); 
        }else{ 
        callback(); 
        }
 
   } else { 
     callback(); 
  }
 
}); 
} 
}

rules

rules: { 
name: [ 
{ 
required: true, 
validator: judgeName, 
trigger: "blur" 
} 
] 
}

2:就是显示后台的提示信息

form-item里有个error的属性,刚用elementUI的童鞋可能很容易忽略

vue.js+element 默认提示中英文操作

<el-form-item label="商户名称" prop="name" :error="errorMsg"> 
<el-input v-model="form.name" size="small" placeholder="请输入商户名称"></el-input> 
</el-form-item>

error要在data里面定义一下不然会报错

channelAdd(this.form).then(response => {
       if (response.success) {
        //成功的结果
        this.$message({
         message: response.message,
         type: "success",
         duration: 2000
        });
       } else {
         //错误信息
        this.errorMsg = response.message
       }
      });

以上这篇vue.js+element 默认提示中英文操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery 1.3 和 Validation 验证插件1.5.1
Jul 09 Javascript
firefox插件Firebug的使用教程
Jan 02 Javascript
使用AJAX实现Web页面进度条的实例分享
May 06 Javascript
jQuery简易时光轴实现方法示例
Mar 13 Javascript
angularjs的select使用及默认选中设置
Apr 08 Javascript
MUI 解决动态列表页图片懒加载再次加载不成功的bug问题
Apr 13 Javascript
JS 中可以提升幸福度的小技巧(可以识别更多另类写法)
Jul 28 Javascript
分享5个顶级的JavaScript Ajax组件库
Sep 16 Javascript
JS/HTML5游戏常用算法之碰撞检测 包围盒检测算法详解【圆形情况】
Dec 13 Javascript
JavaScript设计模式之装饰者模式实例详解
Jan 17 Javascript
vue实现todolist基本功能以及数据存储功能实例详解
Apr 11 Javascript
layui数据表格实现重载数据表格功能(搜索功能)
Jul 27 Javascript
Vue 解决在element中使用$notify在提示信息中换行问题
Nov 11 #Javascript
vue 实现element-ui中的加载中状态
Nov 11 #Javascript
解决vant框架做H5时踩过的坑(下拉刷新、上拉加载等)
Nov 11 #Javascript
JS前端基于canvas给图片添加水印
Nov 11 #Javascript
vant-ui框架的一个bug(解决切换后onload不触发)
Nov 11 #Javascript
使用Vant完成Dialog弹框案例
Nov 11 #Javascript
vue实现lodop打印功能的示例
Nov 11 #Javascript
You might like
详解WordPress中给链接添加查询字符串的方法
2015/12/18 PHP
PHP 构造函数和析构函数原理与用法分析
2020/04/21 PHP
js计算页面刷新的次数
2009/07/20 Javascript
获取URL地址中的文件名和参数的javascript代码
2009/09/02 Javascript
jquery 操作DOM案例代码分享
2012/04/05 Javascript
Jquery和JS用外部变量获取Ajax返回的参数值的方法实例(超简单)
2013/06/17 Javascript
Jquery Ajax解析XML数据(同步及异步调用)简单实例
2014/02/12 Javascript
jQuery页面刷新(局部、全部)问题分析
2016/01/09 Javascript
Jquery attr()方法 属性赋值和属性获取详解
2016/04/15 Javascript
node.js中 stream使用教程
2016/08/28 Javascript
Bootstrap栅格系统学习笔记
2016/11/25 Javascript
vue音乐播放器插件vue-aplayer的配置及其使用实例详解
2017/07/10 Javascript
Js利用prototype自定义数组方法示例
2017/10/20 Javascript
JS/jQuery实现DIV延时几秒后消失或显示的方法
2018/02/12 jQuery
Node.js引入UIBootstrap的方法示例
2018/05/11 Javascript
详解promise.then,process.nextTick, setTimeout 以及 setImmediate的执行顺序
2018/11/21 Javascript
vue.js的双向数据绑定Object.defineProperty方法的神奇之处
2019/01/18 Javascript
[03:08]Ti4观战指南上
2014/07/07 DOTA
django自带的server 让外网主机访问方法
2018/05/14 Python
python tkinter界面居中显示的方法
2018/10/11 Python
Pycharm连接远程服务器并实现远程调试的实现
2019/08/02 Python
django中上传图片分页三级联动效果的实现代码
2019/08/30 Python
python pip安装包出现:Failed building wheel for xxx错误的解决
2019/12/25 Python
pytorch 准备、训练和测试自己的图片数据的方法
2020/01/10 Python
Softmax函数原理及Python实现过程解析
2020/05/22 Python
Python Tornado实现WEB服务器Socket服务器共存并实现交互的方法
2020/05/26 Python
python实现快速文件格式批量转换的方法
2020/10/16 Python
python多线程爬取西刺代理的示例代码
2021/01/30 Python
Python运算符+与+=的方法实例
2021/02/18 Python
应届生会计电算化求职信
2013/10/03 职场文书
乡镇交通安全实施方案
2014/03/29 职场文书
保险内勤岗位职责
2014/04/05 职场文书
读书活动总结范文
2014/04/26 职场文书
妇联主席先进事迹
2014/05/18 职场文书
物流管理专业自荐信
2014/06/23 职场文书
2016年小学“公民道德宣传日”活动总结
2016/04/01 职场文书