<h3 dir="auto">Vue.js version</h3>
<p dir="auto">1.0.26</p>
<h3 dir="auto">Reproduction Link</h3>
<p dir="auto"><a href="https://jsfiddle.net/gregmi/yLqnv2ex/" rel="nofollow">https://jsfiddle.net/gregmi/yLqnv2ex/</a></p>
<h3 dir="auto">Steps to reproduce</h3>
<ol dir="auto">
<li>run and check the output, it says: "params.myAttr: undefined"</li>
<li>comment out the line 13 (props)</li>
<li>run again and check the output, it says: "params.myAttr: content"</li>
</ol>
<h3 dir="auto">What is Expected?</h3>
<p dir="auto">It should say: "myAttr: content"</p>
<h3 dir="auto">What is actually happening?</h3>
<p dir="auto">When there is a tag <strong>attribute</strong> that is also a vue <strong>property</strong> and vue <strong>directive</strong> parameter at the same time, it is not reachable from within a vue directive (<em>this.params.myAttr</em>), but one can get it from vm (<em>this.vm.myAttr</em>).</p>
<p dir="auto">It seem like a race condition of sorts (in time when vm properties are created) between vue component and vue directive.</p>
<h3 dir="auto">Version</h3>
<p dir="auto">2.6.6</p>
<h3 dir="auto">Reproduction link</h3>
<p dir="auto"><a href="https://jsfiddle.net/xayduwf0/" rel="nofollow">https://jsfiddle.net/xayduwf0/</a></p>
<h3 dir="auto">Steps to reproduce</h3>
<p dir="auto">open the link and run</p>
<h3 dir="auto">What is expected?</h3>
<p dir="auto">there should no html in the result window</p>
<h3 dir="auto">What is actually happening?</h3>
<p dir="auto">the result shows all the rendered html</p>
<hr>
<p dir="auto">I'm not sure it is by design or a bug……<br>
The scene I can think of the use of is, if someone use Vue.js in an progressive web page, they maybe need to control the app by themself, like call $destroy by them self, now if they want to clean the document, they need to execute</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="app.$destroy();
app.$el.parentNode.removeChild(app.$el);"><pre lang="javasscript" class="notranslate"><code class="notranslate">app.$destroy();
app.$el.parentNode.removeChild(app.$el);
</code></pre></div>