我无法使用$refs获取表单元素

<template>
  <div>
    <input type="text" v-model="formValue">
    <button @click="submitForm">Submit</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      formValue: ''
    };
  },
  methods: {
    submitForm() {
      console.log(this.formValue); // 获取表单元素的值
      // 执行其他表单提交操作
    }
  }
};
</script>

<template>
  <div>
    <input type="text" ref="inputElement">
    <button @click="submitForm">Submit</button>
  </div>
</template>

<script>
export default {
  methods: {
    submitForm() {
      const formValue = this.$refs.inputElement.value; // 获取表单元素的值
      console.log(formValue);
      // 执行其他表单提交操作
    }
  }
};
</script>