반응형
기능에 전달된 스타일 속성 유형
이 형식 지정 함수를 고려하십시오.
function button(style: any, func: ()=>void, img: string) {
return (
<button
className="Reader_Button"
style={style}
onClick={func}
>
<img src={img} alt="" />
Back
</button>
);
}
첫 번째 인수의 올바른 유형은?style
나는 그것이 HTMLlementStyle과 같은 것이 되어야 한다고 생각하지만 올바른 어조를 찾을 수 없다.
미안, 내가 충분히 명확하지 않았어.의 "any"를 대체하기 위해 어떤 유형을 사용해야 하는지 알고 싶다.style: any
. typecript 정의는 제공된 오브젝트 구성원의 유형 확인을 처리한다.
응용이 아니라 함수의 정의에 대해 말하는 겁니다.
종류는React.CSSProperties
이것을 VSCode에서 찾을 수 있다.<div style={{}}>
그리고 커서 위치에 있을 때 누름style
기여하다
일반 DOM 요소에 대한 스타일 받침대는 키가 css 속성인 객체의 형태여야 한다.
예:<div style={{ width: "100%", backgroundColor: "black" }} />
대시를 포함한 속성의 경우 낙타에 갇히게 된다.예를 들어.background-color
된다backgroundColor
.
"CSstype에서 CSS 가져오기" &&sh랩에서 'maxHeight'를 인용하는 작업: '120px'
import React from 'react';
import CSS from 'csstype';
const shortList = () => {
const listStylus: CSS.Properties = {
'maxHeight': '120px',
'overflow': 'hidden',
}
return (
<div>
<ul style={listStylus} >
<li>Item element 1</li>
<li>Item element 2</li>
</ul>
</div>
)
}
export default shortList
참조URL: https://stackoverflow.com/questions/45019775/type-for-style-attribute-passed-to-function
반응형
'IT이야기' 카테고리의 다른 글
Vue의 글로벌 구성 요소(nuxt) (0) | 2022.03.14 |
---|---|
ASP.NET Core 2.0 레이저 대 각도/반사/기타 (0) | 2022.03.14 |
Typecript에서 'padStart' 속성이 'string' 형식에 존재하지 않는다고 알려준다. 왜? (0) | 2022.03.14 |
반응 - 무거운 하위 구성 요소 렌더링 지연 (0) | 2022.03.13 |
여러 경로를 반응 라우터 v4와 일치 (0) | 2022.03.13 |