Reactjs Cloudinary React不向img标记添加宽度和高度属性

如果我使用类似于：

import React from 'react'
import {Image} from 'cloudinary-react';

export const Logo = () => {
  return (
    <Image
        publicId="logo.png"
        crop="limit"
        width={170}
        height={16}
    />
  );
}

export default Logo;

从“React”导入React
从“cloudinary react”导入{Image}；
导出常量徽标=（）=>{
返回(
);
}
导出默认徽标；

结果我们得到了

<img src="http://res.cloudinary.com/blablabla/image/upload/c_limit,h_16,w_170/v1/logo.png">

img

标签中没有

width

和

height

属性

这就是为什么Google PageSpeed Insights抱怨页面上有许多

img

标签的原因：

---

有办法解决这个问题吗？

你能试着像这样内联传递它吗：

  <Image
        publicId="logo.png"
        crop="limit"
        style={{ width: "170px"; height:"16px" }}
    />

或者您只需在引号中传递它：

  <Image
    publicId="logo.png"
    crop="limit"
    width="170"
    height="16"
/>

---

因此

width=“170”

height=“16”

而不是

width={170}

height={16}

请查看我的答案，也许它会帮助您：）您在输出URL中传递的参数引用添加到输出URL的Cloudinary转换（c_limit，h_16，w_170）但与HTML标记的宽度/高度无关。如果你想设置属性，那么@Sowam的第一个代码示例就可以了。将

宽度

和

高度

参数作为字符串2传递。增加了风格。属性没有出现，但样式属性出现在

img

elemeent中。据我所知，这并不是本文所需要的。但PageSpeed Insights似乎不再抱怨徽标元素了。我还将尝试其他图像元素。谢谢