如何获取文本组件的值？

import React, { useRef } from 'react';

function MyComponent() {
  const inputRef = useRef();

  const handleButtonClick = () => {
    const value = inputRef.current.value;
    console.log(value);
  };

  return (
    <div>
      <input type="text" ref={inputRef} />
      <button onClick={handleButtonClick}>获取值</button>
    </div>
  );
}

<template>
  <div>
    <input type="text" v-model="inputValue" />
    <button @click="handleButtonClick">获取值</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      inputValue: ''
    };
  },
  methods: {
    handleButtonClick() {
      console.log(this.inputValue);
    }
  }
};
</script>