uniapp - 时间轴组件
时间:2020-01-14
本文章向大家介绍uniapp - 时间轴组件,主要包括uniapp - 时间轴组件使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
sunui-timeline 时间轴
v1.0.0 于 2020.01.14更新
参数介绍:
1. @line:点击时间轴所在id(此为子组件传父组件值)- 事件
2. array:时间轴传值给子组件/默认无
示例代码:
<template> <view> <sunui-timeline @line="getId" :array="lineData"></sunui-timeline> </view> </template> <script> import sunUiTimeLine from '@/components/sunui-timeline/sunui-timeline.vue'; export default { data() { return { lineData: [{ id: 1, "content": "【新加坡风投公司Golden Gate Ventures发起规模1000万美元的加密基金】 位于新加坡的风险投资公司Golden Gate Ventures周五宣布,将发起名为LuneX Ventures、规模1000万美元的基金,投资加密货币和区块链技术初创企业。(路透)", "time": "2019-11-12", image: 'https://gss3.bdstatic.com/-Po3dSag_xI4khGkpoWK1HF6hhy/baike/c0%3Dbaike150%2C5%2C5%2C150%2C50/sign=3d01c1b8df09b3deffb2ec3aadd607e4/c9fcc3cec3fdfc03f90a8568da3f8794a5c226eb.jpg' }, { id: 2, "content": "【OKEx发布《关于执行隐藏和下线交易对的项目名单》】据OKEx官方消息,OKEx公布隐藏和下线交易对的项目名单,其中46个项目的Token被隐藏,29个交易对将下线,其中涉及20个项目的部分交易对。这些项目未下线的其他交易对在OKEx平台可以正常交易。 OKEx表示会保持对所有已上线该平台项目的持续关注,若发现存在符合隐藏或下线交易对标准的将会严格执行,同时也会根据项目后续发展情况对隐藏项目进行取消隐藏或下线交易兑的调整。", "time": "2019-11-13", image: 'https://gss3.bdstatic.com/-Po3dSag_xI4khGkpoWK1HF6hhy/baike/c0%3Dbaike150%2C5%2C5%2C150%2C50/sign=3d01c1b8df09b3deffb2ec3aadd607e4/c9fcc3cec3fdfc03f90a8568da3f8794a5c226eb.jpg' }, { id: 3, "content": "【浙江省整治网络传销 重点查处对象包括数字货币传销案件】据浙江在线消息,自今年3月份,浙江省开展网络传销违法犯罪活动联合整治工作,重点查处对象包括以“虚拟货币”为幌子的违法犯罪活动。截至6月底,全省工商(市场监管)部门、公安机关共立案查处传销案件132起,涉案金额11亿多元。", "time": "2019-11-14", image: 'https://gss3.bdstatic.com/-Po3dSag_xI4khGkpoWK1HF6hhy/baike/c0%3Dbaike150%2C5%2C5%2C150%2C50/sign=3d01c1b8df09b3deffb2ec3aadd607e4/c9fcc3cec3fdfc03f90a8568da3f8794a5c226eb.jpg' }] } }, components: { 'sunui-timeline': sunUiTimeLine }, methods: { getId(e) { console.log(e); } } } </script> <style> </style>
点击下载示例:sunui-timeline
原文地址:https://www.cnblogs.com/cisum/p/12193082.html
- 如何启用WSS 3的匿名用户访问
- 移除 WordPress 后台“外观-主题” 管理功能
- 移除 WordPress 后台插件管理的“编辑”与“停用”功能
- 区域设置 ID (LCID) 表
- jquery 表单事件
- Jexus以.NET(Phalanger)方式支持PHP的网站
- jquery鼠标事件
- Jexus 负载均衡
- 用.NET Framework 2.0创建 Form设计器[翻译]
- jquery事件绑定
- Fontello:免费Web-font 图标大集合(font-face 图标集)
- 通过 wp-config.php 禁止安装、升级或编辑WordPress 主题与插件
- 利用VS2005中的Code Snippets提高开发效率
- 用schemaSpy制作数据库文档
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Android编程实现拍照功能的2种方法分析
- 在Ubuntu/Linux环境下使用MySQL开放/修改3306端口和开放访问权限
- 10大HBase常见运维工具整理小结
- Android实现扫一扫识别数字功能
- 通过SSH连接本地linux虚拟机的过程记录
- 实现Android 获取cache缓存的目录路径的方法
- Android 消息分发使用EventBus的实例详解
- 详解Android实现定时器的几种方法
- Android 实现带进度条的WebView的实例
- Android单元测试之对Activity的测试示例
- Android开发之手势检测及通过手势实现翻页功能的方法
- Android开发之CheckBox的简单使用与监听功能示例
- Android将图片上传到php服务器的实例代码
- Android图片识别应用详解
- Android 列表形式的切换的示例代码