JSX.IntrinsicElements 소품 유형에 대한 Rescript 바인딩
3689 단어 rescripttypescriptreactwebdev
우리 작업장에서 반응 라이브러리는 typescript에 크게 의존합니다. 최근 특정 소품에는 유형이 있습니다.
keyof JSX.IntrinsicElements
예를 들어:
interface Props {
...,
tagName?: keyof JSX.IntrinsicElements
}
이제 rescript 쪽에서 이 prop을 전달하는 방법입니다. 문서https://www.typescriptlang.org/docs/handbook/jsx.html#intrinsic-elements와 @types/react/index.d.ts의 유형 정의를 확인한 후, prop 유형 문제를 해결할 다형성 변형을 생각해 냈습니다.
module JSX = {
module IntrinsicElements = {
type t = [
| #a
| #abbr
| #address
| #area
| #article
| #aside
| #audio
| #b
| #base
| #bdi
| #bdo
| #big
| #blockquote
| #body
| #br
| #button
| #canvas
| #caption
| #cite
| #code
| #col
| #colgroup
| #data
| #datalist
| #dd
| #del
| #details
| #dfn
| #dialog
| #div
| #dl
| #dt
| #em
| #embed
| #fieldset
| #figcaption
| #figure
| #footer
| #form
| #h1
| #h2
| #h3
| #h4
| #h5
| #h6
| #head
| #header
| #hgroup
| #hr
| #html
| #i
| #iframe
| #img
| #input
| #ins
| #kbd
| #keygen
| #label
| #legend
| #li
| #link
| #main
| #map
| #mark
| #menu
| #menuitem
| #meta
| #meter
| #nav
| #noindex
| #noscript
| #object
| #ol
| #optgroup
| #option
| #output
| #p
| #param
| #picture
| #pre
| #progress
| #q
| #rp
| #rt
| #ruby
| #s
| #samp
| #slot
| #script
| #section
| #select
| #small
| #source
| #span
| #strong
| #style
| #sub
| #summary
| #sup
| #table
| #template
| #tbody
| #td
| #textarea
| #tfoot
| #th
| #thead
| #time
| #title
| #tr
| #track
| #u
| #ul
| #var
| #video
| #wbr
| #webview
| #svg
| #animate
| #animateMotion
| #animateTransform
| #circle
| #clipPath
| #defs
| #desc
| #ellipse
| #feBlend
| #feColorMatrix
| #feComponentTransfer
| #feComposite
| #feConvolveMatrix
| #feDiffuseLighting
| #feDisplacementMap
| #feDistantLight
| #feDropShadow
| #feFlood
| #feFuncA
| #feFuncB
| #feFuncG
| #feFuncR
| #feGaussianBlur
| #feImage
| #feMerge
| #feMergeNode
| #feMorphology
| #feOffset
| #fePointLight
| #feSpecularLighting
| #feSpotLight
| #feTile
| #feTurbulence
| #filter
| #foreignObject
| #g
| #image
| #line
| #linearGradient
| #marker
| #mask
| #metadata
| #mpath
| #path
| #pattern
| #polygon
| #polyline
| #radialGradient
| #rect
| #stop
| #"switch"
| #symbol
| #text
| #textPath
| #tspan
| #use
| #view
]
}
}
module Tile = {
@genType.import("./Tile") @react.component
external make: (
~tagName: JSX.IntrinsicElements.t
) => React.element = "Tile"
}
이것은 잘 작동합니다. 누구든지 더 나은 제안이 있으면 의견을 말하십시오.
Reference
이 문제에 관하여(JSX.IntrinsicElements 소품 유형에 대한 Rescript 바인딩), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/srikanthkyatham/rescript-bindings-for-jsxintrinsicelements-interface-8la텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)