示例 1: 可交互组件

使用 withInteractable 让 AI 持续编辑同一个组件,实现购物车等交互场景。

学习要点

1. withInteractable

withInteractable 是一个高阶组件(HOC),包装基础组件后,AI 可以持续修改同一个实例。

2. 持续性编辑

与普通组件不同,interactable 组件的修改会累积,而不是每次都创建全新的组件。

3. 实用场景

购物车、待办列表、笔记编辑器等需要连续操作的场景都适合使用 interactable。

4. Schema 定义

propsSchema 定义了哪些属性可以被 AI 编辑,确保组件的关键逻辑不被破坏。

试试这些消息:

  • • "创建一个购物车"
  • • "添加 iPhone 15 Pro,价格 7999 元,数量 1"
  • • "再添加 AirPods Pro,价格 1999 元"
  • • "把 iPhone 改成 2 个"
  • • "删除 AirPods"
  • • "添加 MacBook Pro,13999 元"