javascript - 在 vue 中从 v-for 更改特定 v-model 的数据

Question

你好，vue 爱好者，我只想问我如何控制 v-for 中单个 v-model 的行为。现在，当我将单选按钮更改为引用所有 v-if 等于“引用”时，我只希望将特定行设置为“引用”

现在当我改变一个单一的一切都在改变。这是我的代码。提前致谢。

<div class="card mb10" v-for="(animal,index) in animals">

            <div class="card-body">


            <div class="row">
                <div class="col-md-6">
                    <label>Type</label>
                    <input type="radio" name="animal_type[]" value="noncites" v-model="at">Non Cites  &nbsp; <input type="radio" name="animal_type[]" value="cites" v-model="at">Cites 
                </div>

            </div>
            <br>
            <div class="card mb10" v-for="(animal,index) in animals">

            <div class="card-body">

                <div class="row">
                    <div class="col-md-6">
                            <div class="form-group">
                                    <label>TOTAL MONETARY VALUE in USD: </label>
                                    <input type="number" name="monetary_value" class="form-control" step="0.1" min="1">
                            </div>
                    </div>

                    </div>
                <div class="row">
                    <div class="col-md-6">
                        <label>Type</label>
                        <input type="radio" name="animal_type[]" value="noncites" v-model="at">Non Cites  &nbsp; <input type="radio" name="animal_type[]" value="cites" v-model="at">Cites 
                    </div>

                </div>
            <br>
            <div v-if="at =='cites'">
                    <p>cites</p>
            </div>

            </div>

        </div>

            </div>

这是我的Vue代码：

    new Vue({
      el: '#app',
      data() {
        return {
          animals:[0],
          counter: 0,
          at:[]
        }
      },

  methods: {
    addAnimals(){
        this.counter = this.counter + 1;
        this.animals.push(this.counter);
        console.log(this.animals);
    },
    deleteAnimals(index){
      console.log(index);
      this.animals.splice(index, 1);

      console.log(this.animals);
    }
  }
})