Merge pull request #216 from People-Sea/fix/#213

fix(ma-editor): 修复同一时刻渲染多富文本无效

Author: kanyxmo

src/components/ma-editor/index.vue

@@ -68,7 +68,7 @@ const appStore = useAppStore()
 const props = defineProps({
   modelValue: {type: String},
   height: {type: Number, default: 400},
-  id: {type: String, default: () => 'tinymce' + new Date().getTime().toString()},
+  id: {type: String, default: () => tool.uuid()},
   plugins: {
     type: [String, Array],
     default:
@@ -132,7 +132,7 @@ const getStoreMode = (mode) => {
   return uploadConfig.storageMode[mode.toString()]
 }
 
-const editorKey = ref(new Date().getTime())
+const editorKey = props.id
 
 watch(
     () => list.value,

src/utils/tool.js

@@ -359,4 +359,16 @@ tool.arrSum = (arr) => {
   return sum
 }
 
+tool.uuid = () => {
+  const randomBytes = CryptoJS.lib.WordArray.random(16);
+  const randomHex = randomBytes.toString(CryptoJS.enc.Hex);
+  return [
+    randomHex.substr(0, 8),
+    randomHex.substr(8, 4),
+    randomHex.substr(12, 4),
+    randomHex.substr(16, 4),
+    randomHex.substr(20, 12)
+  ].join('-');
+}
+
 export default tool