title: Allowing for multiple modals in Vue.js
body: <p>Following the demo on the official site (<a href="http://vuejs.org/examples/modal.html" rel="nofollow">http://vuejs.org/examples/modal.html</a>)</p>
  
  <p>I'm trying to set this up so that I can define multiple modal windows on a page, like this </p>
  
  <p><a href="http://jsfiddle.net/m2sv4at5/" rel="nofollow">http://jsfiddle.net/m2sv4at5/</a></p>
  
  <p>But since <code>modals['foo']</code> and <code>modals['bar']</code> aren't defined, Vue is throwing warnings that it's getting invalid types being sent into the prop. As soon as I initialize the script with <code>false</code> for both, it works, but that requires me to hard-code those modal names into the script, which is what I don't want.</p>
  
  <p>In jQuery I would do this by defining a data target and simply making sure that matches an element with the right ID and a class of <code>modal</code>, but I'm unsure how to do something similar in Vue.</p>