2016-08-24 5 views
2

react-bootstrap-typeaheadのカスタムTypescript定義を作成しようとしています。これまでのところ、ここで私は、ドキュメントに基づいたものです:react-boostrap-typeaheadのカスタムTypescript定義

// Custom made typings based on exampes: https://github.com/ericgio/react-bootstrap-typeahead 

declare namespace ReactBootstrapTypeahead { 
    import React = __React; 

    // Input 
    class ReactBootstrapTypeahead extends React.Component<ReactBootstrapTypeaheadProps, any> { 

    } 

    interface ReactBootstrapTypeaheadProps extends React.HTMLProps<ReactBootstrapTypeahead> { 
     align?: string; 
     allowNew?: boolean; 
     defaultSelected?: any[]; 
     disabled?: boolean; 
     emptyLabel?: string; 
     labelKey?: string; 
     maxHeight?: number; 
     minLength?: number; 
     multiple?: boolean; 
     name?: string; 
     newSelectionPrefix?: string; 
     onBlur?(): any; 
     onChange?(): any; 
     onInputChange?(): any; 
     options: any[]; 
     paginateResults?: number; 
     paginationText?: string; 
     placeholder?: string; 
     renderMenuItemChildren?(): any; 
    } 
} 

declare module 'react-bootstrap-typeahead' { 
    export = ReactBootstrapTypeahead; 
} 

私はコンポーネントを使用しようとすると、私はカップルのエラーを取得しています:

Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components). 

Uncaught Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. 

私はこの全体の活字体の定義に新たなんです何か助けていただければ幸いです。

+0

だけで罰金をコンパイルする必要がありますがhttpsにこれを公開するために管理しました:// WWW .npmjs.com /〜タイプ? – velop

答えて

3

ライブラリの宣言ファイルを記述するときは、グローバル宣言の代わりにモジュール宣言ファイルにすべてをラップしようとすることを強くお勧めします。

私は最初にreact(typings install react --save)のモジュラー宣言ファイルを取得します。

次に、あなたの宣言ファイルを変更して、具体的に反応からの入力を引き出したいと思います。

カスタムタイピング/反応し、ブートストラップ・先行入力

declare module 'react-bootstrap-typeahead' { 
    import React = require('react') 
    interface ReactBootstrapTypeaheadProps extends React.HTMLProps<ReactBootstrapTypeahead> { 
    // ¯\_(ツ)_/¯ 
    } 
    class ReactBootstrapTypeahead extends React.Component<ReactBootstrapTypeaheadProps, any> { 
    } 
    export = ReactBootstrapTypeahead 
} 

どこでもあなたのプロジェクトでは、これは

import ReactTypeahead = require('react-bootstrap-typeahead') 
+0

実装の詳細については、[この問題](https://github.com/ericgio/react-bootstrap-typeahead/issues/116#issuecomment-267625659)および対応する[プルリクエスト](https:// github .com/ericgio/react-bootstrap-typeahead/pull/128)。しかし、基本的に@Pelleは上記のように述べています。 – ericgio

関連する問題