javascriptの私有財産の構文認識されていない

Question

質問の明確化：

具体的には、Idは以下の例はtypescriptですなしで書き込むことができる方法を知りたいです。クラスなどのプロパティを宣言する方法を理解することは私にとっては役に立ちます。私は実装でtypescriptを使わずにblueprintjs（typescriptで書かれている）を使うことができるはずだと信じています。

---

私がドキュメントを以下のよ：

import { Button, Position, Toaster } from "@blueprintjs/core"; 


class MyComponent extends React.Component { 
    private toaster: Toaster; 
    private refHandlers = { 
     toaster: (ref: Toaster) => this.toaster = ref, 
    }; 

    public render() { 
     return (
      <div> 
       <Button onClick={this.addToast} text="Procure toast" /> 
       <Toaster position={Position.TOP_RIGHT} ref={this.refHandlers.toaster} /> 
      </div> 
     ) 
    } 

    private addToast =() => { 
     this.toaster.show({ message: "Toasted!" }); 
    } 
} 

をしかし、私は 'プライベート' の後に 'トースター' であるSyntax Error: Unexpected token, expected ((5:16)を得る：http://blueprintjs.com/docs/#components.toaster.js.react

ありサンプルコードこのようなものです。私はタイスクリプトをあらかじめコンパイルしていません。私はwebpackでes6を使用しています。自分の環境でこのサンプルコードを書き直すにはどうすればよいですか？

ありがとうございました。

Answer 1

ここで私はそれをやった方法です。私はこのチュートリアルに基づいてwebpackから少しの助けを受けました：https://www.typescriptlang.org/docs/handbook/react-&-webpack.html。私はtsconfig.jsonの設定ファイルのターゲットをes6に設定しました。これはwebpackをコンパイルしたものです（多かれ少なかれ）。

このソリューションを手動で改善してください。

import {Button, Position, Toaster} from "@blueprintjs/core"; 

class ToastLauncher extends React.Component { 

    constructor(props) { 
     super(props); 

     this.refHandlers = { 
      toaster: (ref) => this.toaster = ref, 
     }; 

     this.addToast =() => { 
      this.toaster.show({ message: "Toasted!" }); 
     }; 

    } 

    render() { 
     return (
      <div> 
       <Button onClick={this.addToast} text="Procure toast" /> 
       <Toaster position={Position.TOP_RIGHT} ref={this.refHandlers.toaster} /> 
      </div> 
     ) 
    } 
} 

export default ToastLauncher 

Answer 2

blueprintjsはtypescriptを使用して実装されており、その例ではtypescript構文が使用されています。

参照：http://blueprintjs.com/docs/#TypeScript