0

ヘルプ。私は長い間すべてのコードをチェックしてきましたが、ここで何が問題なのか理解できません。

import React from 'react'
import css from './FormsControls.module.css'
import commonCss from '../styles.module.css'
import { Field } from 'redux-form'
import cn from 'classnames'

const FormControl = ({ input, meta: { touched, error }, children, text, mainClass, noerror }) => {
  const hasError = touched && error
  return (
    <div className={cn(css.formControl, mainClass)}>
      <label htmlFor={input.name}>{text}</label>
      {children}
      {!noerror && hasError && <div className={css.error}>{error}</div>}
    </div>
  )
}

ファイルの名前をjsからtsに変更した後に問題が発生しました。これはタイプが原因ではないことがわかります

4

1 に答える 1

1

要するに: JSX と Typescript を組み合わせたい場合は.tsx、 ではなくを使用する必要があります.ts。

JSX と Typescript はどちらも、独自に開発された JavaScript の拡張機能です。その結果、それらの構文にはいくつかの矛盾があり、特に山括弧の意味と矛盾しています。JSX では要素に山かっこが使用されますが、typescript では型アサーションに使用されます。したがって、両方を使用するファイルを解析しようとすると、すべての場合に何が何であるかを明確に伝える方法はありません。

これを解決するために、typescript では、山かっこを JSX 要素と見なすように指定できます。これを行う方法は、ファイル拡張子によるものです。ファイルでは、.tsxJSX 要素を使用でき、パーサーはそれらが型アサーションであると誤って判断することはありません。この結果、山かっこアサーションを.tsxファイル内で一貫して使用することはできないため、as代わりにアサーションを使用する必要があります。

于 2020-07-09T14:29:39.223 に答える