title: Vue.js - my multi accordion menu component is not working by toggle flags
body: <p>I am using Vue. And I created <code>MultiAccordion</code> component for my test case. I want to open slide by <code>status[index]</code> flag. But this component is not working.  Why this is not working?</p>
  
  <pre><code>var MultiAccordion = {
      data: function() {
          return {
              items: [
                  'cat',
                  'dog',
                  'bird',
              ],
              status: [],
          };
      },
      created: function() {
          for (let i = 0; i &lt; this.items.length; ++i) {
              this.status.push(false);
          }
      },
      methods: {
          handleToggle: function(index) {
              this.status[index] = !this.status[index];
          },
      },
      template: `
      &lt;ul&gt;
          &lt;li v-for="(val, index) in items"&gt;
              &lt;button @click="handleToggle(index)"&gt;toggle&lt;/button&gt;
              &lt;div v-if="status[index]"&gt;
                  {{ val }}
              &lt;/div&gt;
          &lt;/li&gt;
      &lt;/ul&gt;
      `,
  };
  </code></pre>