조건문 (+ 타이프 라이터 반응)

우리는 잠시 동안 반응 jsx 사용하고 있고, 조건문 우리는 내가 정말 좋아 jsx 제어 명령문 사용하고

<If condition={something === true}> 
    <div>Something</div> 
</If>

을 프로젝트가 좋은 TypeScript로 옮겼지만 jsx-control-statements는 더 이상 작동하지 않습니다. 그 이유는 조건식이 React 구성 요소가 아니라 transpilation 단계에서 Babel에 의해 처리되므로 TypeScript가 컴파일되지 않기 때문입니다.

내 옵션은 무엇입니까?

If- 구성 요소를 만드는 것에 대해 생각했지만 새로운 요소에 결과를 래핑해야 할 필요가 있습니다.

출처

2017-03-07 severin

다른 점은 조건부를 React 구성 요소로 구현하면 명령문의 내용을 추가 요소에 포함해야한다는 것입니다. 또한 jsx-control-statements가 이미 잘 수행 한 것을 다시 구현할 필요가 없다는 것이 좋습니다. – severin

효과가없는 정보를 충분히 제공하지 못했지만 추가 JSX 요소가있는 라이브러리가 아닌 jsx-control-statements이 바벨 플러그인이라는 사실과 관련이 있습니다.

는

(1) 세계적으로 사용 가능한 요소에 대한 선언 파일/typings을 추가

는 당신이 필요가 타이프 라이터와 함께 작동하도록합니다. 예 : 같은 : 당신의 tsconfig.json에서

declare function If (condition: any): any; 
declare var Choose: any; 
declare function When (condition: any): any; 
declare var Otherwise: any;

(2) preserve에 jsx을 설정합니다. 대상을 ES2015로 설정하고 바벨이 작업을 수행하도록 할 수도 있습니다.

(3) babel + 플러그인을 사용하여 JSX를 번역하십시오. TypeScript로 전환하기 전의 구성이 가능할 가능성이 높습니다.

jsx-control-statements를 직접 사용하고 있지 않습니다. 따라서 위의 내용이 올바르게 작동하지 않을 수 있으며 추가 단계를 수행해야합니다.

출처

2017-03-07 15:31:53

나는 옵션 2-3을 선호하며 jab와 함께 babel이 이전처럼 작동하도록합니다. – vitkon

그건 단계가 아니라고 생각합니다. : D TypeScript는 예를 들어''JSX 요소를 알지 못하므로. –

감사! 애매한 묘사에 대해 유감스럽게 생각합니다. 내 문제는, 당신이 생각한 것처럼, TypeScript는 문을 인식하지 못하기 때문에 컴파일되지 않을 것입니다. 1 단계는 문제를 해결했으며 2 단계와 3 단계는 이미 완료되었다고 생각합니다 :) – severin

답변

관련 문제