title: VueJs mounted nextTick function not being called
body: <p>How do I get functionality to execute when switching between two components of the same type?</p>
  
  <p><strong>The Problem:</strong> I have several map and chart components that need to display different data.  When switching from a map to a chart component, the <code>mounted/nextTick</code> function runs as expected.  When switching from one map to another map, the <code>mounted/nextTick</code> function does not run which results in vue's model reflecting the change in current map but the DOM still showing the previous element.</p>
  
  <p><strong>Another Example:</strong> More generically, lets say I have components A and B.  The user creates A1, A2, and B1.  When the user switches between any component of type A and B ((A1||A2) &amp;&amp; B1), the <code>mounted/nextTick</code> function runs as expected.  When the user shows component A1 and the switches to A2, the DOM continues to show the data for A1.</p>
  
  <p><strong>Question:</strong> How do I get the DOM to reflect changes from one component to another of the same type?</p>
  
  <p><strong>Example:</strong></p>
  
  <pre><code>&lt;side-bar&gt;&lt;/side-bar&gt; &lt;!-- List of elements to choose from (ex: map1, map2, graph1)--&gt;
  &lt;template&gt; &lt;!-- The element to be shown with different data depending on which element was clicked --&gt;
      &lt;map v-if="active[0].type == 'map'" :data="changes"&gt;&lt;/map&gt;
      &lt;graph v-if="active[0].type == 'graph'" :data="changes"&gt;&lt;/graph&gt;
  &lt;/template&gt;
  </code></pre>