title: VueJs: Form handling with Vuex and inputs generated with an API
body: <p>Here's an example of a component:</p>
  
  <pre><code>&lt;script&gt;
      export default {
          name: 'my-form',
  
          computed: {
              myModules() {
                  return this.$store.state.myModules;
              }
          }
  &lt;/script&gt;
  
  &lt;template&gt;
      &lt;form&gt;
          &lt;p v-for="module in myModules"&gt;
              &lt;input type="checkbox" :value="module.id" /&gt;
              &lt;label&gt;module.name&lt;/label&gt;
          &lt;/p&gt;
          &lt;button type="submit"&gt;Submit&lt;/button&gt;
      &lt;/form&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>The associated store:</p>
  
  <pre><code>    state: {
          myModules: []
      },
  
      mutations: {
          setModules(state, modules) {
              state.myModules = modules;
          }
      },
  
      actions: {
          getModules({commit}) {
              return axios.get('modules')
              .then((response) =&gt; {
                  commit('setModules', response.data.modules);
              });
          }
      }
  </code></pre>
  
  <p>And finally, an example of return of the API "getModules":</p>
  
  <pre><code>modules : [
      {
          id: 1,
          name: 'Module 1',
          isActive: false
      },
      {
          id: 2,
          name: 'Module 2',
          isActive: false
      },
      {
          id: 3,
          name: 'Module 3',
          isActive: false
      }
  ]
  </code></pre>
  
  <p><strong>My question: what's the best way to change the "isActive" property of each module to "true" when I check the checkbox corresponding to the associated module, directly in the store?</strong></p>
  
  <p>I know that Vuex's documentation recommends to use "<a href="https://vuex.vuejs.org/en/forms.html" rel="nofollow noreferrer">Two-way Computed Property</a>" to manage the forms, but here I don't know the number of modules that the API can potentially return, and I don't know their name.</p>
  
  <p>Thank you in advance!</p>