由backgroundImage引起的路径问题

1,717 阅读1分钟

以 React 为例,

1,backgroundImage的路径

虽然变量 t 是一个字符串的路径,但如果其中有空格,下面的写法就会解析错误,因为是css

<div style={{backgroundImage: `url(${t})`}}></div>

所以,如果有空格,url中的内容就必须用引号引起来,而因为``的效果,下面这样写是可以的,并不会将这个变量认为是字符串。

<div style={{backgroundImage: `url("${t}")`}}></div>

2,img中的路径

就不会有这样的情况,因为 src 是原生的属性。

<img src={t} alt="" />

3,标签的属性

如果出错了,是不会渲染到标签中的,比如 style 和 className 属性,

所以,在测试的时候,可以通过自定义的属性,如data-的形式,这样始终都会渲染出来。

其实img的src的属性也是因为这个原因吧,自身的属性,不需要做解析。