gpt4 book ai didi

javascript - 如何使用 prismjs 在 vuejs 中添加复制到剪贴板功能?

转载 作者:搜寻专家 更新时间:2023-10-30 22:45:28 26 4
gpt4 key购买 nike

我正在使用 vue-prism-component ( https://www.npmjs.com/package/vue-prism-component ) 显示 Html 语法。现在我想添加一个按钮来复制代码。到目前为止,我已经找到了一个库 vue-clipboard2 ( https://www.npmjs.com/package/vue-clipboard2 ),它们从输入标签中获取文本。我如何通过单击按钮选择由 vue-prism-component 生成的 Html 语法。

最佳答案

Prism 有一些用于实现此类功能的文档

https://prismjs.com/plugins/copy-to-clipboard/

这里是从 vue-prism-component 复制代码的示例代码

[Codepen] https://codepen.io/wilbo/pen/xRVLOj

你需要添加这个剪贴板的依赖 https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.5.12/clipboard.min.js

另一个不在 vue 中的 codepen 示例,只是为了理解

[Codepen] https://codepen.io/drhodes/pen/NAOgpG

关于javascript - 如何使用 prismjs 在 vuejs 中添加复制到剪贴板功能?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58092562/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com