快速开始
安装完成后使用非常简单,一下为示例
轮播图
基础用法
点击查看示例代码
vue
<template>
<h-carousel-v1 :h_data="h_data"></h-carousel-v1>
</template>
<script setup>
const h_data = {
items: [
{
header: '项目一: 企业微信自动化测试全流程实战',
image: 'https://s21.lgstatic.com/growth/activity/20220902/1662108650690.png',
description: [
'项目介绍',
'企业微信是腾讯微信团队打造的企业通讯与办公工具,具有与微信一致的沟通体验,丰富的OA应用,和连接微信生态的能力,可帮助企业连接内部、连接生态伙伴、连接消费者。专业协作、安全管理、人际服务。'
],
content: [
'应用技术',
'web自动化测试、接口自动化测试、功能测试、持续集成'
],
},
{
header: '项目二: litemall电子商城系统',
image: 'https://s21.lgstatic.com/growth/activity/20220902/1662108650690.png',
description: [
'项目介绍',
'litemall电子商城系统,包含用户和管理员两个角色。用户主要使用小程序与商城前端,管理员有专门系统的后端平台。主要功能包含会员管理,商城管理,商品管理,推广管理,系统管理,配置管理,统计报表等功能。'
],
content: [
'应用技术',
'web自动化测试、接口自动化测试、功能测试、持续集成'
],
},
{
header: '项目三: 测试人论坛',
image: 'https://s21.lgstatic.com/growth/activity/20220902/1662108650690.png',
description: [
'项目介绍',
'基于Discourse 搭建的测试工程师技术社区。主要功能包括发帖、回复、点赞、收藏等社交性功能,还有搜索、分类等数据管理功能。'
],
content: [
'应用技术',
'web自动化测试、功能测试'
],
}
]
}
</script>
<template>
<h-carousel-v1 :h_data="h_data"></h-carousel-v1>
</template>
<script setup>
const h_data = {
items: [
{
header: '项目一: 企业微信自动化测试全流程实战',
image: 'https://s21.lgstatic.com/growth/activity/20220902/1662108650690.png',
description: [
'项目介绍',
'企业微信是腾讯微信团队打造的企业通讯与办公工具,具有与微信一致的沟通体验,丰富的OA应用,和连接微信生态的能力,可帮助企业连接内部、连接生态伙伴、连接消费者。专业协作、安全管理、人际服务。'
],
content: [
'应用技术',
'web自动化测试、接口自动化测试、功能测试、持续集成'
],
},
{
header: '项目二: litemall电子商城系统',
image: 'https://s21.lgstatic.com/growth/activity/20220902/1662108650690.png',
description: [
'项目介绍',
'litemall电子商城系统,包含用户和管理员两个角色。用户主要使用小程序与商城前端,管理员有专门系统的后端平台。主要功能包含会员管理,商城管理,商品管理,推广管理,系统管理,配置管理,统计报表等功能。'
],
content: [
'应用技术',
'web自动化测试、接口自动化测试、功能测试、持续集成'
],
},
{
header: '项目三: 测试人论坛',
image: 'https://s21.lgstatic.com/growth/activity/20220902/1662108650690.png',
description: [
'项目介绍',
'基于Discourse 搭建的测试工程师技术社区。主要功能包括发帖、回复、点赞、收藏等社交性功能,还有搜索、分类等数据管理功能。'
],
content: [
'应用技术',
'web自动化测试、功能测试'
],
}
]
}
</script>