Card v6
基础用法
点击查看示例代码
vue
<template>
<h-card-v6 class="h-left h-row-1" :h_data="h_data"></h-card-v6>
</template>
<script setup>
const h_data = {
component: 'h-card-v6',
action: [
{
"api": {
"header": {}
},
"class": "disabled",
"link": "https://www.baidu.com",
"display_name": "查看详情"
},
{
"api": {
"header": {}
},
"link": "#/issues/:id",
"display_name": "编辑"
},
{
"api": {
"header": {}
},
"link": "#/issues/:id",
"display_name": "返回"
},
],
content: [
{
image: 'https://ceshiren.com/uploads/default/original/3X/4/d/4d3b8204803034fe7293fcd7b1b3473c759827c8.png',
header: '90天产品经理实战班',
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
},
{
image: 'https://ceshiren.com/uploads/default/original/3X/4/d/4d3b8204803034fe7293fcd7b1b3473c759827c8.png',
header: '90天产品经理实战班',
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
},
]
}
</script>
<template>
<h-card-v6 class="h-left h-row-1" :h_data="h_data"></h-card-v6>
</template>
<script setup>
const h_data = {
component: 'h-card-v6',
action: [
{
"api": {
"header": {}
},
"class": "disabled",
"link": "https://www.baidu.com",
"display_name": "查看详情"
},
{
"api": {
"header": {}
},
"link": "#/issues/:id",
"display_name": "编辑"
},
{
"api": {
"header": {}
},
"link": "#/issues/:id",
"display_name": "返回"
},
],
content: [
{
image: 'https://ceshiren.com/uploads/default/original/3X/4/d/4d3b8204803034fe7293fcd7b1b3473c759827c8.png',
header: '90天产品经理实战班',
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
},
{
image: 'https://ceshiren.com/uploads/default/original/3X/4/d/4d3b8204803034fe7293fcd7b1b3473c759827c8.png',
header: '90天产品经理实战班',
meta: ['BAT大厂', '7200元', '三个月'],
description: ['学习大厂实用方法论,做有大局观、能拿结果的产品经理', '学习大厂实用方法论,做有大局观、能拿结果的产品经理'],
},
]
}
</script>