门户网站如何建设方案常州网站建设优化
问题描述
使用 vue3-json-viewer
查看 JSON 格式的数据,但是点击右上角的复制按钮无法将数据复制到操作系统的剪贴板。
发现问题
假如自带有此功能,那么浏览器应该有 Error 级别的日志,但是查看控制台只发现了 Warning 的日志如下:
事实加上
@copied
后依然存在此警告。
解决
给 JsonViewer
组件增加 @copied
:
<JsonViewer:value="jsonData"copyablesortboxedtheme="dark":expand-depth="3"expanded@copied="copyData" // 这里新加的
><template v-slot:copy="{copied}"><span v-if="copied">已复制</span><span v-else>复制</span></template>
</JsonViewer>
function copyData(cpd) {navigator.clipboard.writeText(cpd.text)
}
就可以复制了,但是依然会有上面的警告,不知道原因。