• 中英文i18 vue参数传递


    1.传递多个参数的情况

    组态的时候需要中英文,做校验,但是校验的函数又是传参的形式,所以中英文的时候就翻译不出

    解决办法

    common.getI18n(i18n.t('message.app_message_lengthLimit',[min,max]))
        //长度限${0}~${1}
        lengthLimit:(trigger='change',min=0,max=32)=>{
            const message = common.getI18n(i18n.t('message.app_message_lengthLimit',[min,max]));
            //const validator = {min,max,message,trigger};
            const validator = {
                validator(rule, value, callback) {
                    if(value && value.length >= min && value.length <= max){
                        callback();
                    }else{
                        callback(new Error(message));
                    }
                },
                trigger 
            };
            return trigger === 'both' ? [{...validator,trigger:'change'},{...validator,trigger:'blur'}] : validator;
        },

    翻译文件:

    //message
    app_message_cantOnlySpace:'不能只空格',//不能只空格
    app_message_isExisted:'{0}已经存在',//{0}已经存在
    app_message_lengthLimit:'长度限{0}~{1}',//长度限{0}~{1}
    app_message_noSpecialChar:'不能包含特殊字符',//不能包含特殊字符
    app_message_numberRange:'请输入{0}~{1}的整数',//请输入{0}~{1}的整数
    app_message_required:'此项为必填',//此项为必填

    然后再在页面调用:

    <el-form-item label="名称" prop="pageName" :rules="[...rules.lengthLimit('both',1,32),...rules.cantOnlySpace('both'),...rules.noSpecialChar('both',false)]">
         <el-input v-model="canvasSetting.pageName" @input="setCanvasParam($event,'pageName')" @focus="onFocus" @blur="onBlur" maxlength="32"></el-input>
    </el-form-item>
    getI18n函数
        //如果获取不到国际化则取默认值
        getI18n(val) {
            return val.startsWith('message') ? (val.split('.')[1] == 'undefined' ? '' : val.split('.')[1]) : val
        },
  • 相关阅读:
    msp430时钟小结
    JDBC第一天连接池案例
    maltab几个常见的问题
    qt 获取天气的接口
    Qt Style Sheets制作UI特效
    qt 在指定区域添加图片
    qt 设置背景图片
    linux下mysql数据库的学习
    qt文本编辑器
    C++小游戏:扑克牌21点
  • 原文地址:https://www.cnblogs.com/pengfei25/p/14553735.html
Copyright © 2020-2023  润新知