refactor(util): 优化objToStyle方法实现并补充细节
新增多项特性:自动转换驼峰式CSS属性为短横线命名、过滤无效样式值、补充分号、处理非对象入参,同时完善注释说明
This commit is contained in:
@@ -1139,15 +1139,27 @@ export default {
|
||||
return route;
|
||||
},
|
||||
/**
|
||||
* 对象转style字符串
|
||||
* 对象转 style 字符串
|
||||
* - 自动将 camelCase 转 kebab-case(fontSize → font-size),CSS 自定义属性(以 -- 开头)保持原样
|
||||
* - 自动过滤值为 undefined / null / '' 的项,避免输出脏数据
|
||||
* - 末尾补一个 ';',方便与其他 style 拼接
|
||||
* - 非对象入参一律返回 ''
|
||||
* @param {Object} obj
|
||||
* @return {String}
|
||||
*/
|
||||
objToStyle(obj) {
|
||||
let s = [];
|
||||
for (let i in obj) {
|
||||
s.push(i + ':' + obj[i]);
|
||||
if (!obj || typeof obj !== 'object') return '';
|
||||
const s = [];
|
||||
const keys = Object.keys(obj);
|
||||
for (let i = 0; i < keys.length; i++) {
|
||||
const k = keys[i];
|
||||
const v = obj[k];
|
||||
if (v === undefined || v === null || v === '') continue;
|
||||
// 以 -- 开头的 CSS 自定义属性保持原样;其余 camelCase 转 kebab-case
|
||||
const key = k.indexOf('--') === 0 ? k : k.replace(/[A-Z]/g, m => '-' + m.toLowerCase());
|
||||
s.push(key + ':' + v);
|
||||
}
|
||||
return s.join(';')
|
||||
return s.length ? s.join(';') + ';' : '';
|
||||
},
|
||||
/**
|
||||
* 颜色减值
|
||||
|
||||
Reference in New Issue
Block a user