如何判断页面加载时选中了哪些复选框？

var checkboxes = document.querySelectorAll('input[type="checkbox"]');
var selectedCheckboxes = [];

for (var i = 0; i < checkboxes.length; i++) {
  if (checkboxes[i].checked) {
    selectedCheckboxes.push(checkboxes[i]);
  }
}

console.log(selectedCheckboxes);

var selectedCheckboxes = $('input[type="checkbox"]:checked');

console.log(selectedCheckboxes);

<template>
  <div>
    <input type="checkbox" v-model="checkbox1" />
    <input type="checkbox" v-model="checkbox2" />
    <input type="checkbox" v-model="checkbox3" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      checkbox1: false,
      checkbox2: true,
      checkbox3: false
    };
  },
  watch: {
    checkbox1() {
      this.logSelectedCheckboxes();
    },
    checkbox2() {
      this.logSelectedCheckboxes();
    },
    checkbox3() {
      this.logSelectedCheckboxes();
    }
  },
  methods: {
    logSelectedCheckboxes() {
      console.log(this.checkbox1, this.checkbox2, this.checkbox3);
    }
  }
};
</script>