我来帮您将 hero-1v2 组件从4组(图+文)改为2组(图+文),保持左右一一对应。
按照保留前2组("Storybook 是什么?" 和 "组件驱动开发")来处理,这是最合理的选择,因为它们是整体概念的引入。
```json
{
"summary": "将 hero-1v2 组件的轮播图片和文字从4组改为2组,保留前2组内容('Storybook 是什么?'和'组件驱动开发'),删除后2组('组件展示和测试'和'文档化'),保持左右侧一一对应,轮播参数同步更新。",
"widget": {
"fullWidth": false,
"spacer": "none",
"containerClasses": "!overflow-visible",
"bg": {
"classes": "bg-center overlay overlay-80",
"overlay": "",
"img": {
"src": "/assets/images/hero/bg-pattern-hero.png",
"alt": "",
"classes": "bg-cover",
"mobile": "/assets/images/hero/bg-pattern-hero.png"
}
},
"animate": {
"aos": {
"enable": false
}
},
"extra": {
"uuid": "0d9561ad-82f5-4ac6-a07e-bfc186705257",
"id": "441",
"type": "json"
},
"bgClasses": "bg-center overlay overlay-80",
"overlay": "",
"id": "",
"type": "hero-1v2",
"classes": "text-light text-center",
"right": {
"params": {
"navigation": false,
"slidesPerView": 1,
"spaceBetween": 0,
"pagination": true
},
"classes": "",
"elements": [
{
"type": "img",
"src": "https://builder.design/assets/images/16-9/business-13.jpg",
"style": {
"opacity": "",
"borderRadius": "",
"boxShadow": "",
"aspectRatio": "",
"objectFit": ""
},
"classes": "object-cover",
"width": 800,
"height": 500
},
{
"type": "img",
"src": "https://builder.design/assets/images/16-9/business-14.jpeg",
"style": {
"opacity": "",
"borderRadius": "",
"boxShadow": "",
"aspectRatio": "",
"objectFit": ""
},
"classes": "object-cover",
"width": 800,
"height": 500
}
]
},
"left": {
"params": {
"navigation": false,
"slidesPerView": 1,
"spaceBetween": 0,
"pagination": false
},
"classes": "",
"elements": [
{
"type": "text",
"title": {
"label": "Storybook 是什么?",
"classes": "mat-headline-3"
},
"classes": "text-white",
"body": "Storybook是一个开源的前端工具,用于开发、测试和文档化UI组件。它提供了一个独立的环境,开发人员可以在其中构建和展示单个UI组件,而无需依赖于整个应用程序的上下文。",
"actionsAlign": "start",
"actions": [
{
"href": "#",
"mode": "raised",
"label": "查看更多",
"pill": true,
"type": "btn"
}
]
},
{
"type": "text",
"title": {
"label": "组件驱动开发",
"classes": "mat-headline-3"
},
"classes": "text-white",
"body": "Storybook采用了组件驱动开发的方法,即将UI组件作为开发的核心单元。开发人员可以在Storybook中为每个UI组件创建\"stories\",描述组件在不同状态和交互方式下的行为和外观。这种方法能够提高组件的可重用性和可测试性。",
"actionsAlign": "start",
"actions": [
{
"href": "#",
"mode": "raised",
"label": "查看更多",
"pill": true,
"type": "btn"
}
]
}
]
}
}
}
```
### 改动说明
| 区域 | 修改内容 |
|------|---------|
| **左侧文字** `left.elements` | 从4组删减为2组,保留第1、2项("Storybook 是什么?" 和 "组件驱动开发") |
| **右侧图片** `right.elements` | 从4张删减为2张,保留第1、2张(business-13.jpg、business-14.jpeg) |
| **轮播参数** | 保持不变(slidesPerView: 1),2张图片依然正常轮播 |
> 提示:如果您希望保留不同的组合(例如保留第3、4组),或者想用新的图片/文案替换,请告诉我,我可以进一步调整。