Vue - 最新详细实现任意内容展开 / 收起功能组件，支持自定义文字或容器的收起折叠和展开内容功能效果（支持自定义高度、动态展开与折叠、自定义展开与收起文案、动态增删数据自动计算高度、过渡动画等）_vue3 - 实现任意内容展开 / 收起功能组件插件,点击查看更多内容控制段落文字展开

作者：小蓝xlanll | 2024-02-11 20:28:18

踩

vue3 - 实现任意内容展开 / 收起功能组件插件,点击查看更多内容控制段落文字展开

网上大部分 内容展开 / 收起功能 组件都有一定程度上的小 BUG，并且代码非常臃肿难以使用，灵活度不高。

本文 实现了在 vue2 / vue3 / nuxt 网站项目开发中，让一段文字或一个div容器，内容展开或折叠收起功能，支持动态数据。

本文实现了一个该功能组件，具体功能请看标题，并完成了组件文档的编写，

您将以最简单的方式使用它，如下效果图所示：

在这里插入图片描述

您直接在项目中创建一个组件，把下面的代码进行 一键复制，进行使用。

例如，在 components 文件夹下创建 collapse.vue 文件，写入以下代码。

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/小蓝xlanll/article/detail/76840