Meteor - Arrow関数がES6の各ループを壊している

Question

私はこれを求める正しい領域を得たいと思っています... 以下は、私が取り組んでいる2つのファイルのいくつかのコードです。関数内の 'this.'を矢印の関数に変更すると、コードは期待どおりに機能しなくなります。

誰かが私が間違っていることを説明できますか？矢印機能を使用するときは、何か別のことをする必要がありますか？私はこれを使っているのですか？間違って始める？このように矢印関数を使用しないでください。

お願いします。

クライアント/ビュー/ jobList.html

{{#each jobs}} 
    <tr> 
     <td>{{jobID}}</td> 
      <td>{{user.fullname}}</td> 
      <td>{{product.type}}</td> 
      <td>{{shortDesc}}</td> 
      <td>{{formattedDate}}</td> 
      <td>{{phone}}</td> 
      <td>{{user.username}}</td> 
      <td>{{jobType}}</td> 
      <td>{{product.brand}}</td> 
      <td>{{product.type}}</td> 
      <td>{{product.model}}</td> 
     </tr> 
    {{/each}} 

クライアント/ビュー/ jobList.js矢印機能に関する基本的な事柄の

Template.jobList.helpers({ 
    jobs:()=> Jobs.find({}, {sort: {jobDate: 1}}), 

    formattedDate: function() { // Changing this to arrow function breaks functionality 
     let d = this.jobDate; 
     let e = formatDate(d); 
     return e; 
    }, 
    shortDesc: function() { // Changing this to arrow function breaks functionality 
     if (this.description.length > 40) { 
      return this.description.substr(0, 50) + '...'; 
     } else { 
      return this.description 
     } 
    }, 
    jobID: function() { // Changing this to arrow function breaks functionality 
     let a = this.jobNum; 
     let e = this.jobType.substr(0, 1); 
     return e + a 
    } 
}); 

Answer 1

一つは、彼らが継承していることである（を閉じて）thisが作成されたコンテキストで表示されます。あなたのコードは、関数が呼び出される方法によって設定されたthisに依存しているので、矢印関数はそこでは良い選択ではありません。

var obj = { 
 
    foo:() => { 
 
     console.log("foo: this.prop:", this.prop); 
 
    }, 
 
    bar: function() { 
 
     console.log("bar: this.prop:", this.prop); 
 
    }, 
 
    prop: "the property" 
 
}; 
 
obj.foo(); // Doesn't show `prop` because `this` != `obj` 
 
obj.bar(); // Does show `prop` because `this` == `obj`