效果

目录

效果

一、介绍

 1、官方文档

2、官方示例

 二、准备工作

1、安装依赖包

2、示例版本 

三、使用步骤

1、单文件导入

2、使用

四、完整示例

欢迎关注VX公众号：前端小知识营地

---

一、介绍

 1、官方文档

https://cryptojs.altervista.org/

2、官方示例

​

 二、准备工作

1、安装依赖包

npm install crypto-js
# 或使用yarn
yarn add crypto-js

2、示例版本 

"crypto-js": "^4.2.0",

三、使用步骤

1、单文件导入

import CryptoJS from 'crypto-js';

2、使用

const useCombinedMD5 = (product, device) => {
  return computed(() => {
    const combinedStr = `${product}${device}`;
    return CryptoJS.MD5(combinedStr).toString();
  });
};

四、完整示例

<template>
  <div>
    {{ useCombinedMD5('6hjdr5rtyfdsfwe3', 'cGCrkK7Ex4FESAwe_TEST01_m1') }}
  </div>
</template>

<script lang="ts" setup>
import { computed } from 'vue'
import CryptoJS from 'crypto-js'

const useCombinedMD5 = (product: string, device: string) => {
  return computed(() => {
    const combinedStr = `${product}${device}`
    return CryptoJS.MD5(combinedStr).toString()
  })
}
</script>

欢迎关注VX公众号：前端小知识营地