Card v7
基础用法
点击查看示例代码
vue
<template>
<h-card-v7 :h_data="h_data"></h-card-v7>
</template>
<script setup>
const h_data = {
component: 'h-card-v7',
class_list: 'h-row-4',
header: '90天产品经理实战班',
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
extra: [
{ name: '查看详情', link: 'https://www.baidu.com' },
{ name: '修改', link: 'https://www.baidu.com' },
{ name: '返回', link: 'https://www.baidu.com' },
],
content: [
{
header: {
name: ['90天产品经理实战班', '90天产品经理实战班'],
class: ''
},
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
extra: [
{ name: '查看详情', link: 'https://www.baidu.com' },
{ name: '修改', link: 'https://www.baidu.com' },
{ name: '返回', link: 'https://www.baidu.com', class: ' ml-auto' },
],
},
{
header: '90天产品经理实战班',
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
extra: [{ name: '查看详情', link: 'https://www.baidu.com' }, { name: '修改', link: 'https://www.baidu.com' }],
},
{
header: '90天产品经理实战班',
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
extra: [{ name: '查看详情', link: 'https://www.baidu.com' }, { name: '修改', link: 'https://www.baidu.com' }],
},
{
header: '90天产品经理实战班',
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
extra: [{ name: '查看详情', link: 'https://www.baidu.com' }, { name: '修改', link: 'https://www.baidu.com' }],
},
]
}
</script>
<template>
<h-card-v7 :h_data="h_data"></h-card-v7>
</template>
<script setup>
const h_data = {
component: 'h-card-v7',
class_list: 'h-row-4',
header: '90天产品经理实战班',
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
extra: [
{ name: '查看详情', link: 'https://www.baidu.com' },
{ name: '修改', link: 'https://www.baidu.com' },
{ name: '返回', link: 'https://www.baidu.com' },
],
content: [
{
header: {
name: ['90天产品经理实战班', '90天产品经理实战班'],
class: ''
},
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
extra: [
{ name: '查看详情', link: 'https://www.baidu.com' },
{ name: '修改', link: 'https://www.baidu.com' },
{ name: '返回', link: 'https://www.baidu.com', class: ' ml-auto' },
],
},
{
header: '90天产品经理实战班',
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
extra: [{ name: '查看详情', link: 'https://www.baidu.com' }, { name: '修改', link: 'https://www.baidu.com' }],
},
{
header: '90天产品经理实战班',
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
extra: [{ name: '查看详情', link: 'https://www.baidu.com' }, { name: '修改', link: 'https://www.baidu.com' }],
},
{
header: '90天产品经理实战班',
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
extra: [{ name: '查看详情', link: 'https://www.baidu.com' }, { name: '修改', link: 'https://www.baidu.com' }],
},
]
}
</script>