在TypeScript中使用scrollTop方法時發生呼叫簽名錯誤

我希望cardSummary元素在單擊時滾動到頂部。這是我到目前爲止已經應用於：在TypeScript中使用scrollTop方法時發生呼叫簽名錯誤

public onClickHandler(event: React.MouseEvent<any>): void { 
    if (this.props.onClick) { 
     console.log("scroll"); 
     if (this.isInViewport(this._cardSummary) === false) { 
      this._cardSummary.scrollTop(0); 
      this.props.onClick(event); 
     } 
    } 
}

現在，當我想編譯這個，我得到一個錯誤Cannot invoke an expression whose type lacks a call signature. Type 'Number' has no compatible call signatures.

我有什麼做的調用方法scrollTop的時元失效視口？

這裏是整體組件：

export class CardSummary extends React.Component<ICardSummaryProps, undefined> { 
    public static defaultProps = { labelColor: "transparent" }; 

    private _cardSummary: HTMLDivElement; 

    public render(): JSX.Element { 
     return <div className="card-summary" onClick={this.onClickHandler.bind(this)} ref={(el) => this._cardSummary = el } > 
      <div> 
       <div className="color" style={{ "backgroundColor": this.props.labelColor, flexShrink: 0, "float": "left" }}></div> 
       <div className="row card-rowcontainer"> 
        {this.props.children} 
       </div> 
      </div> 
     </div>; 
    } 

    public isInViewport(element: boolean) { 
     const rect = element.getBoundingClientRect(); 
     const html = document.documentElement; 
     return (
      rect.top >= 0 && 
      rect.left >= 0 && 
      rect.bottom <= (window.innerHeight || html.clientHeight) && 
      rect.right <= (window.innerWidth || html.clientWidth) 
     ); 
    } 

    public onClickHandler(event: React.MouseEvent<any>): void { 
     if (this.props.onClick) { 
      console.log("scroll"); 
      if (this.isInViewport(this._cardSummary) === false) { 
       this._cardSummary.scrollTop(0); 
       this.props.onClick(event); 
      } 
     } 
    } 
}

來源

2017-05-16 mdarmanin

'_cardSummary'的類型是什麼？ – Saravana

_cardSummary是一個HTMLDivElement – mdarmanin

'scrollTop（）'是一個jQuery方法。在DOM元素上，它只是一個返回滾動位置的屬性。你的意思是使用jQuery或'window.scrollTo'？ – Saravana

要確保你包括內部tsconfig.json上LIB DOM類型：

"target": "es5", 
"lib": [ 
    "dom", 
    "es5", 
    "scripthost" 
],

注意如果您的圓盾是ES5默認包含庫應該不要，es5和scripthost，所以，你應該很好地覆蓋。

試試看，如果沒有，請分享你的tsconfig。

來源

2017-05-16 09:16:43

在TypeScript中使用scrollTop方法時發生呼叫簽名錯誤

回答

相關問題