vue 實現SHA加解密

Vue.js本身并不直接提供SHA（Secure Hash Algorithm）加密的功能，它主要用于构建用户界面。然而，你可以结合JavaScript库如`crypto-js`或者`js-sha256`来实现在Vue组件中进行SHA哈希计算。

以下是一个简单示例，使用`crypto-js`库在Vue组件内进行SHA-256加密和解密：

首先，你需要安装`crypto-js`：

npm install crypto-js

然后，在你的Vue组件中导入`CryptoJS`并使用它：

<script setup>
import * as CryptoJS from 'crypto-js';

export default {
  data() {
    return {
      inputText: '',
      hashedText: '',
    };
  },
  methods: {
    hashPassword(password) {
      this.hashedText = CryptoJS.SHA256(password).toString();
    },
    unhashPassword(hashedPassword) {
      try {
        const bytes = CryptoJS.parseHS256(hashedPassword);
        const password = bytes.toString(CryptoJS.enc.Utf8);
        this.inputText = password;
      } catch (e) {
        console.error('Invalid hash or unable to unhash.');
      }
    },
  },
};
</script>

在模板中，你可以创建输入框和按钮来触发加密和解密操作：

<input v-model="inputText" placeholder="Enter text">
<button @click="hashPassword(inputText)">Hash</button>
<button @click="unhashPassword(hashedText)">Unhash</button>

注意，由于浏览器安全限制，对于敏感数据的存储，你应该考虑在服务器端进行真正的加密存储，而不是仅仅在客户端做哈希。