fix:DEFECT-858 复制Topic一次后,第二次就复制不上了

@@ -47,8 +47,8 @@
           </div>
         </BasicModal>
       </div>
-      <Description @register="register" class="mt-4" :data="deviceDetail" />
-    </div>
+      <Description @register="register" class="mt-4" :data="deviceDetail" /> </div
+    >设备Topic
     <div class="mt-4">
       <a-button type="primary" class="mr-4" @click="copyTbDeviceId">复制设备ID</a-button>
       <a-button type="primary" class="mr-4" @click="copyDeviceToken">复制访问令牌</a-button>
@@ -75,6 +75,7 @@
   import { Description, useDescription } from '/@/components/Description';
   import { QuestionCircleOutlined } from '@ant-design/icons-vue';
   import { DeviceTypeEnum } from '/@/api/device/model/deviceModel';
+  import { useClipboard } from '@vueuse/core';
 
   import wz from '/@/assets/images/wz.png';
   export default defineComponent({
@@ -154,10 +155,10 @@
         const token = await getDeviceToken(props.deviceDetail.tbDeviceId);
         openModal(true, token);
       };
-      const copyTopic = (value) => {
-        clipboardRef.value = value;
-        console.log(clipboardRef.value);
-        createMessage.success('复制成功~');
+      const { copy } = useClipboard();
+      const copyTopic = (val) => {
+        copy(val);
+        createMessage.success('复制成功！');
       };
 
       const [registerTopicModal, { openModal: openTopicModal }] = useModal();