更新记录

1.0.2(2023-11-17)

style: dot样式微调

1.0.1(2023-11-06)

文档参数更正

1.0.0(2023-11-06)

首次发布

查看更多

平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.1.0 × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
×

zero-timeline

一. 插件说明

个人仅测试与vue2,vue3,微信小程序,其他平台请自行测试

二. 使用方法

符合easycom组件模式, 导入 uni_modules 后直接使用即可

<template>
    <view class="container">
        <view class="wrap">
            <zero-timeline :dataList='dataList' gap='30px'></zero-timeline>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                dataList:[]
            }
        },
        created(){
            this.init()
        },
        methods: {
            init(){
                for(let i=0;i<10;i++){
                    const obj = {
                        // time: `2023-11-1${i}`,
                        title: `feat:这是标题${i}`,
                        content: `完成功能完成功能完成功能完成功能`,
                        sub: `补充内容`,
                        leftTime:`2023-11-1${i}`,
                        leftTitle: `11月1${i}日`,
                        leftContent: `开始\n|\n结束`,
                        color: '#11998e',
                    }
                    this.dataList.push(obj)
                }
            }
        }
    }
</script>

三. 参数说明

参数 类型 默认值 描述
dataList Array false 开关状态
showLeft Boolean true 是否显示左边区域
leftWidth String 150rpx 左边区域宽度
gap String 20rpx 每一个item的上下间隔

dataList参数说明

以下dataList参数均为非必填,根据需求自由组合即可

参数 类型 描述
time String 右侧显示的时间
title String 右侧标题
content String 右侧主要内容
sub String 右侧补充内容
leftTime String 左侧显示的时间
leftTitle String 左侧标题
leftContent String 左侧内容分
color String 自定义item颜色

插件预览: code

小程序搜索: zerojs零技术

预览的小程序不一定能及时更新当前插件

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问