title: Accessing props in vue component data function
body: <p>I am passing a props to a component:</p>
  <pre class="lang-html prettyprint-override"><code>    &lt;template&gt;
         {{messageId}}
         // other html code
      &lt;/template&gt;
      
      &lt;script&gt;
         export default {
            props: ['messageId'],
            data: function(){
               var theData={
                  // below line gives ReferenceError messageId is not defined
                  somevar: messageId,
                  // other object attributes
               }
            }
         }
      &lt;/script&gt;
  </code></pre>
  <p>In above code, I have commented the line that gives the error. If I remove that line, it works as normal and template renders properly (and I can see the expected value of {{messageId}} as well). Hence the logic to pass data is correct.</p>
  <p>It seems that the way to access the <code>messageId</code> in data() is wrong.
  So how do I access the props <code>messageId</code> in data?</p>