未定義エラーのプロパティを読み取れません: Vue バインド オブジェクト プロパティのクラス バインディング タイプが間違っています

Question

オブジェクト プロパティに基づいてクラスをバインドしようとしていますが、@click をトリガーするためにリスト オブジェクトをクリックすると、isSelected のオブジェクト プロパティを読み取れないとコンソールに表示されます...動的にレンダリングされたリスト項目でこれを実行しようとしています。関数を使用して項目の ID を受け取り、このプロパティが false または true に設定されている場合にクラスをアクティブ化します

誰かが下のコードで何が足りないのか教えてくれると嬉しいです、ありがとう :)

<ul class="daysList">
  <li v-for="1 月の日" v-bind:class="{addedToTrip: day.isSelected}" class="daynum" @click="toggleIsSelected(day)" :key= 「day.id」>
      {{day.val}}
  </li>
  </ul>

私の vue データ

data:function(){
    戻る{
      年: 2021、
      月: 1、
      1日目、
      日:[18,19,20,21]、
      1月：[
          {名前: '1 月'、isSelected: false、id: 1、val:1},
          {名前: '1 月'、isSelected: false、id: 2、val:2},
          {名前: '1 月'、isSelected: false、id: 3、val:3},
          {名前: '1 月'、isSelected: false、id: 4、val:4},
          {名前: '1 月'、isSelected: false、id: 5、val:5},
          {名前: '1 月'、isSelected: false、id: 6、val:6},
          {名前: '1 月'、isSelected: false、id: 7、val:7},
          {名前: '1 月'、isSelected: false、id: 8、val:8},
          {名前: '1 月'、isSelected: false、id: 9、val:9},
          {名前: '1 月'、isSelected: false、id: 10、val:10},
          {名前: '1 月'、isSelected: false、id: 11、val:11},
          {名前: '1 月'、isSelected: false、id: 12、val:12},
          {名前: '1 月'、isSelected: false、id: 13、val:13},
          {名前: '1 月'、isSelected: false、id: 14、val:14},
          {名前: '1 月'、isSelected: false、id: 15、val:15},
          {名前: '1 月'、isSelected: false、id: 16、val:16},
          {名前: '1 月'、isSelected: false、id: 17、val:17},
          {名前: '1 月'、isSelected: false、id: 18、val:18},
          {名前: '1 月'、isSelected: false、id: 19、val:19},
          {名前: '1 月'、isSelected: false、id: 20、val:20},
          {名前: '1 月'、isSelected: false、id: 21、val:21},
          {名前: '1 月'、isSelected: false、id: 22、val:22},
          {名前: '1 月'、isSelected: false、id: 23、val:23},
          {名前: '1 月'、isSelected: false、id: 24、val:24},
          {名前: '1 月'、isSelected: false、id: 25、val:25},
          {名前: '1 月'、isSelected: false、id: 26、val:26},
          {名前: '1 月'、isSelected: false、id: 27、val:27},
          {名前: '1 月'、isSelected: false、id: 28、val:28},
          {名前: '1 月'、isSelected: false、id: 29、val:29}、
          {名前: '1 月'、isSelected: false、id: 30、val:30},
          {名前: '1 月'、isSelected: false、id: 31、val:31},

      ]、
      2月：[]、
      行進：[]、
      4月：[]、
      5月：[]、
      六月：[]、
      7月：[]、
      8月:[]、
      9月：[]、
      10月：[]、
      11月：[]、
      12月：[]、
     

    }
  },

isSelected == true の場合に使用される CSS クラス

.addedToTrip{
    背景色: #2E9CFE;
    ボーダートップ: 0.5px ソリッドブラック;
    border-bottom: 0.5px の黒一色。
}

Answer 1

クラス名を指定する場合は一重引用符を使用する必要があります

リーリー