title: Vuejs: Can't access (computed) props within computed property loop
body: <p>Perhaps an obvious one, but I have a <strong>Vue Single File Component</strong> like this: </p>
  
  <pre><code>&lt;template&gt;
  ...
  &lt;/template&gt;
  
  &lt;script&gt;
      export default {
          props: [ 'matches', 'results' ],
  
          computed: {
  
             formattedMatches: function () {
                  let rows = [];
                  this.matches.forEach(function($match, $i) {
                      rows[$i] = {
                          id: $i + 1,
                          title: $match[0] + ' ' + $match[1]
                      };
                  });
                  return rows;
              },
  
              formattedResults: function () {
                  let rows = [];
                  this.results.forEach(function($resultRow, $i) {
                      rows[$i] = {
                          id: $i + 1,
                          title: this.formattedMatches[$i]     
   // Error in render: "TypeError: Cannot read property 'formattedMatches' of undefined"
                      };
                  });
                  return rows;
              },
      ...
  &lt;/script&gt;
  </code></pre>
  
  <p>The error shows up also if I try with <code>this.matches</code>, not only with <code>this.formattedMatches</code>. I suppose it is a matter of variable scopes within classes and methods, but I do not even know if there is another better way or pattern to achieve that same behaviour.</p>
  
  <p>Any ideas? Thanks in advance.</p>