React 구성 요소의 조건에 따라 속성을 동적으로 추가하는 방법은 무엇입니까?
P粉665427988
2023-08-20 14:54:00
<p>특정 조건이 충족되는 경우에만 React 구성 요소에 속성을 추가하는 방법이 있나요? </p>
<p>사후 렌더링된 Ajax 호출의 조건을 기반으로 양식 요소에 필수 및 readOnly 속성을 추가해야 하지만 <code>readOnly="false"< /code> 속성 생략과 완전히 다릅니다. </p>
<p>아래 예는 제가 원하는 것을 보여주어야 하지만 작동하지 않습니다. </p>
<인용문>
<p>(분석 오류: 예상치 못한 식별자)</p>
</인용문>
<pre class="brush:js;toolbar:false;">function MyInput({isRequired}) {
return <input classname="foo" {isRequired ? "required" : ""} />
}
</pre>
<p><br /></p>
juandemarco의 답변은 일반적으로 정확하지만 여기에 또 다른 옵션이 있습니다.
원하는 대로 개체 만들기:
으아악렌더링을 위해 스프레드를 사용하고, 다른 소품을 전달하도록 선택할 수도 있습니다.
으아악분명히 일부 속성의 경우 React에 전달된 값이 실제 값이 아닌 경우 React는 지능적으로 속성을 생략합니다. 예:
으아악다음을 받게 됩니다:
으아악업데이트: 이런 일이 어떻게, 왜 발생하는지 궁금한 사람이 있다면 ReactDOM 소스 코드, 특히 DOMProperty.js 파일의 30행과 167에서 자세한 내용을 확인할 수 있습니다.