Gradler Kim

index.js:1 Warning: Updating a style property during rerender (background) when a conflicting property is set (backgroundPosition) can lead to styling bugs. To avoid this, don't mix shorthand and non-shorthand properties for the same value; instead, replace the shorthand with separate values.
오류 내용을 번역해 보면 background와 관련된 속성값들을 축약된 형태(shorthand)로 섞어 쓰지 말라는 의미입니다.
<pre class="language-css"><code>background: 
 `linear-gradient(to bottom, rgba(0,0,0,0)
 39%, rgba(0,0,0,0)
 41%, rgba(0,0,0,0.65)
 100%), url('${props.image}'), #1c1c1c`,
 backgroundSize: '100%, cover',
 backgroundPosition: 'center, center',

// 위와 같이 축약된 속성과 축약되지 않은 속성이 섞여서 작성된 속성들을 모두 축약되지 않은 형태로 분리시키면 오류가 발생하지 않습니다.
background: 
 `linear-gradient(to bottom, rgba(0,0,0,0)
 39%, rgba(0,0,0,0)
 41%, rgba(0,0,0,0.65)
 100%)`,
 backgroundColor: '#1c1c1c',
 backgroundImage: `url('${props.image}')`,
 backgroundSize: '100%, cover',
 backgroundPosition: 'center, center',</code></pre>

안녕하세요, 질문이 있습니다.

강의에서 사용되고 있는 API들은 themoviedb.org 에서 제공하는 API들입니다.
API 전체 목록은 아래 링크에서 확인하실 수 있습니다.
https://developers.themoviedb.org/3

Gradler Kim

Posts