我想知道是否有任何内置函数或将SVG样式属性转换为JSX的反应。
我有这样的风格：
'opacity:0.647;fill:#cbcbcb;fill-opacity:1;stroke:#cbcbcb;stroke-width:0.26458335;stroke-opacity:1'
我想将其转换为：
{{"opacity":"0.647","fill":"#cbcbcb","fillOpacity":"1","stroke":"#cbcbcb","strokeWidth":"0.26458335","strokeOpacity":"1"}}
有什么简单的方法吗？
没有内置功能。您可以使用简单的reducer函数将样式字符串转换为对象，然后将其作为prop传递。
const str =
"opacity:0.647;fill:#cbcbcb;fill-opacity:1;stroke:#cbcbcb;stroke-width:0.26458335;stroke-opacity:1";
const styles = str.split(";");
const svgStyles = styles.reduce((obj, item, i) => {
const [key, value] = item.split(":");
const updatedkey = key.replace(/-([a-z])/ig, s => s.slice(-1).toUpperCase());
obj[updatedkey] = value;
return obj;
}, {});
console.log(svgStyles);本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句