title: Radio input in v-for loop selects multiple radio buttons of the same value
body: <p>A bit difficult to explain, </p>
  
  <p>I have created a simple rating system which uses <code>input type ="radio"</code> for a products array. </p>
  
  <p>Using <code>v-for="product in products"</code>, I loop through the array showing all the products on the page. </p>
  
  <pre><code>            &lt;div class="block" v-for="product in products"&gt;
                      &lt;h3&gt;{{product.name}}&lt;/h3&gt;
                      &lt;p&gt;Desc: {{product.description}}&lt;/p&gt;
                      &lt;p&gt;Price: £{{product.price}}&lt;/p&gt;
  
  
                      &lt;h3&gt;Rating&lt;/h3&gt;
                      &lt;form @submit.prevent="ratingAdd(product)"&gt;
                      &lt;input type="radio" value = "1" name = "ratings1" v-model="ratingNum"&gt;1
                      &lt;input type="radio" value = "2" name = "ratings2" v-model="ratingNum"&gt;2
                      &lt;input type="radio" value = "3" name = "ratings3" v-model="ratingNum"&gt;3
                      &lt;input type="radio" value = "4" name = "ratings4" v-model="ratingNum"&gt;4
                      &lt;input type="radio" value = "5" name = "ratings5" v-model="ratingNum"&gt;5
                      &lt;input type="submit"&gt;
  
                  &lt;/div&gt;
  </code></pre>
  
  <p>The products display just fine, but whenever I click on a radio button it selects multiple radio buttons of the same value across all products. i.e If I click on 3 on product 1, it would select 3 on the rest of the products as well. </p>
  
  <p>I did try using the same name as well. It does not work.  </p>
  
  <p>Any help will be appreciated. </p>
  
  <p>Thanks in advance. </p>