更新记录

1.0.0（2025-03-07） 下载此版本

1.0.0

平台兼容性

折叠组件

组件名：uj-collapse 和 uj-collapse-list

安装方式

本组件符合easycom规范，HBuilderX 2.5.5起，只需将本组件导入项目，在页面template中即可直接使用，无需在页面中import和注册components。

uj-collapse

以更加灵活的方式实现折叠功能，高度自定义

uj-collapse-list

小白直接使用的折叠组件，具有不限层级，动画更加流畅舒适，方便使用等特点

有项目需要开发的请联系 QQ:371524845

开发不易，如果帮助到你的，请支持 有问题请留言，作者会积极更新

uj-collapsePanel 用法

<uj-collapse title="父面板1">
    <image src="/static/logo.png"></image>
  <uj-collapse title="子面板1">
    <p>子面板1的内容: 春江潮水连海平，海上明月共潮生。滟滟随波千万里，何处春江无月明！</p>
    <uj-collapse title="子子面板1">
      <p>子子面板1的内容: 春江潮水连海平，海上明月共潮生。滟滟随波千万里，何处春江无月明！</p>
    </uj-collapse>
  </uj-collapse>
  <uj-collapse title="子面板2">
    <p>子面板2的内容: 春江潮水连海平，海上明月共潮生。滟滟随波千万里，何处春江无月明！</p>
  </uj-collapse>
</uj-collapse>
<uj-collapse title="父面板2">
  <p> 春江潮水连海平，海上明月共潮生。滟滟随波千万里，何处春江无月明！ </p>
</uj-collapse>

API

参数

事件

uj-collapse-list 用法

<template>
    <div>
        <uj-collapse-list :list="data" />
    </div>
</template>

<script>
    export default {
        data() {
            return {
                list: [
                      {
                        title: '一级标题',
                        content: '一级内容一级内容一级内容一级内容一级内容',
                        expanded: false,
                        children: [
                          {
                            title: '二级标题1',
                            content: '二级内容二级内容二级内容二级内容二级内容二级内容',
                            expanded: false,
                            children: [
                              {
                                title: '三级标题1',
                                content: '三级标题三级标题三级标题三级标题三级标题',
                                expanded: false
                              }
                            ]
                          },{
                            title: '二级标题2',
                            content: '二级内容二级内容二级内容二级内容二级内容二级内容',
                            expanded: false,
                            children: [
                              {
                                title: '三级标题2',
                                content: '三级标题三级标题三级标题三级标题三级标题',
                                expanded: false
                              }
                            ]
                          }
                        ]
                      },
                      {
                        title: '一级标题 2',
                        content: '一级内容 2',
                        expanded: false
                      }
                    ]
            };
        }
    };
</script>

API

参数

事件