Vue3 使用MD5加密（清晰明了）

在Vue 3中使用MD5加密，你可以通过引入第三方库如crypto-js来实现。首先，你需要安装crypto-js：

npm install crypto-js

然后，在你的Vue组件中引入crypto-js并使用其MD5功能：

<template>
  <div>
    <input v-model="input" placeholder="输入一些文字" />
    <button @click="encryptData">加密</button>
    <p>加密结果: {{ encrypted }}</p>
  </div>
</template>
 
<script>
import { ref } from 'vue';
import CryptoJS from 'crypto-js';
 
export default {
  setup() {
    const input = ref('');
    const encrypted = ref('');
 
    const encryptData = () => {
      encrypted.value = CryptoJS.MD5(input.value).toString();
    };
 
    return {
      input,
      encrypted,
      encryptData
    };
  }
};
</script>

在这个例子中，我们创建了一个简单的Vue 3组件，其中包含一个输入框和一个按钮。当用户点击按钮时，输入框中的文本会被MD5加密，并显示加密后的结果。crypto-js库被用来实现MD5加密。