如何将选择标记中的选项传递给另一个选择标记？

const select1 = document.getElementById('select1');
const select2 = document.getElementById('select2');

select1.addEventListener('change', function() {
  select2.value = select1.value;
});

$('#select1').change(function() {
  $('#select2').val($(this).val());
});

<template>
  <div>
    <select v-model="selectedOption1">
      <option value="option1">Option 1</option>
      <option value="option2">Option 2</option>
      <option value="option3">Option 3</option>
    </select>
    <select v-model="selectedOption2">
      <option value="option1">Option 1</option>
      <option value="option2">Option 2</option>
      <option value="option3">Option 3</option>
    </select>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedOption1: '',
      selectedOption2: ''
    };
  },
  watch: {
    selectedOption1(newValue) {
      this.selectedOption2 = newValue;
    }
  }
};
</script>