2017-07-12 34 views
1

我試圖嵌入上它起到了Vimeo的與FRAMEBORDER和將allowFullScreen屬性,象這樣一個MyOwnComponent一個iframe:反應,和/打字稿不能識別iframe的性能

const MyOwnVimeoComponent =() => { 
return (
    <div> 
     <iframe 
      src="https://player.vimeo.com/video/VIMEOID" 
      width="640" 
      height="360" 
      frameborder="0" 
      webkitallowfullscreen 
      mozallowfullscreen 
      allowfullscreen 
     ></iframe> 
    </div> 
);} 

但是,我得到的錯誤是:

[ts] Property 'frameborder' does not exist on type 'HTMLProps<HTMLIFrameElement>' 

同爲webkitallowfullscreenmozallowfullscreenallowfullscreen

研究在堆棧中的其他類似的問題後溢出它導致我檢查Typescript的lib.d.ts文件並查看<HTMLIFrameElement>接口和變量聲明。

該接口的確具有frameborderallowfullscreen類型的屬性,但它仍然會引發該錯誤。我會理解它是否只爲webkitallowfullscreenmozallowfullscreen拋出錯誤,但我通常對這裏發生的事情感到困惑。

如果任何人都可以指出我在正確的方向,將不勝感激。

供參考,在這裏是什麼似乎是lib.d.ts文件的相關部分:

interface HTMLIFrameElement extends HTMLElement, GetSVGDocument { 
align: string; 
allowFullscreen: boolean; 
allowPaymentRequest: boolean; 
border: string; 
readonly contentDocument: Document; 
readonly contentWindow: Window; 
frameBorder: string; 
frameSpacing: any; 
height: string; 
hspace: number; 
longDesc: string; 
marginHeight: string; 
marginWidth: string; 
name: string; 
noResize: boolean; 
onload: (this: HTMLIFrameElement, ev: Event) => any; 
readonly sandbox: DOMSettableTokenList; 
scrolling: string; 
src: string; 
vspace: number; 
width: string; 
addEventListener<K extends keyof HTMLIFrameElementEventMap>(type: K, listener: (this: HTMLIFrameElement, ev: HTMLIFrameElementEventMap[K]) => any, useCapture?: boolean): void; 
addEventListener(type: string, listener: EventListenerOrEventListenerObject, useCapture?: boolean): void; 
} 

declare var HTMLIFrameElement: { 
    prototype: HTMLIFrameElement; 
    new(): HTMLIFrameElement; 
} 

回答

1

正如你可以在lib.d.ts文件中看到,它應該是frameBorder,不frameborder

別擔心,我花了一段時間才發現它!