中英文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
    },