function resoLveAsset(options, type, id, warnMissing) {
if (typeof (id) !== 'string') {
return;
}
const assets = options[type];
if (hasOwn(assets, id)) return assets[id];
const camelizedId = camelize(id);
if (hasOwn(assets, camelizedId)) return assets[camelizedId];
const PascalCaseId = capitlize(camelizedId);
if (hasOwn(assets, PascalCaseId)) return assets[PascalCaseId];
// const res assets[id] || assets[camelizedId]||PascalCaseId
if(process.env.NODE_ENV!=='production'&& warnMissing&&!res){
warn('Fail to resolve' + type.slice(0,-1)+':'+id, options);
}
return res;
}
- 判断过滤器id是否为字符串,不是则终止
- 用assets存储过滤器
- hasOwn函数检查assets自身是否存在id属性,存在则返回
- hasOwn函数检查assets自身是否存在
驼峰化后的
id属性,存在则返回 - hasOwn函数检查assets自身是否存在将
首字母大写后的
id属性,存在则返回 - 如果还是没有,就是去原型链找,找不到就会打印警告
过滤器的原理其实很简单,无非就是在编译阶段就把过滤器编译成函数进行调用
,串联的过滤器就是嵌套调用
。关于编译成函数的时候就是利用vue的内部函数parseFilters
,解析过滤器列表并进行拼接字符串
。