文心快码可生成符合React Native 0.74+规范、含轮播图、商品列表和底部TabBar的首页代码，支持fetch对接/api/v1/home/banner与/api/v1/products接口，内置SafeAreaView包裹、StatusBar适配及埋点逻辑。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
用文心快码生成React Native移动端首页
你想快速搭建一个带轮播图、商品列表和底部导航的React Native首页，不希望从零写样式和状态逻辑，直接让文心快码输出可运行代码。
打开文心快码网页版或调用API，确保已登录并选择「文心快码」模型（非通用文心一言）。
在提示框中输入以下结构化指令，【必须包含 platform: 'react-native' 和 version: '0.74+'】，否则生成的组件会默认适配Web或老版本API：
```
生成一个React Native移动端首页，要求：
- 使用SafeAreaView包裹全局
- 顶部为3张图片轮播（使用FlatList实现，自动轮播+手动滑动）
- 中间是“热销商品”标题+水平滚动商品卡片列表（每张卡片含图片、标题、价格）
- 底部固定TabBar，含“首页”“分类”“购物车”“我的”四个图标和文字
- 所有UI组件使用@react-navigation/native + @react-navigation/bottom-tabs + react-native-screens
- 不要任何第三方UI库如NativeBase或Moti
- 输出完整可复制的JSX文件，含必要import语句和默认导出
点击运行，等待10～15秒。若返回报错“缺少依赖声明”，说明你漏写了version字段——此时直接补全后重试即可。
给文心快码加业务约束：对接真实API接口
你已有后端提供 /api/v1/home/banner 和 /api/v1/products 接口，希望首页自动拉取数据并渲染，而非静态占位。
方法一：在原始提示末尾追加数据层约束
在原提示最后新增两行：
```
- 轮播图数据从 fetch('/api/v1/home/banner') 获取，响应格式为 { banners: [{ id, image_url, title }] }
- 商品列表从 fetch('/api/v1/products?limit=8') 获取，响应格式为 { items: [{ id, name, price, image_url }] }
方法二：用XML标签显式分隔逻辑层（更稳定）
把整个提示改写为：
```
【注意：不能写成 axios.get() 或 useQuery，文心快码默认只识别原生fetch + React Hooks】
修复常见渲染异常：iOS白屏与安卓状态栏遮挡
第一步：检查生成代码中是否出现 StatusBar 标签
如果存在
第二步：确认 SafeAreaView 是否包裹了全部内容
常见错误是只包了ScrollView而漏掉TabBar，正确写法必须是：
SafeAreaView → View（flex:1）→ ScrollView + TabBar（同级，都在View内）。
第三步：安卓状态栏文字颜色适配
在TabBar组件外层加一层 View，设置 style={{ paddingTop: Platform.OS === 'android' ? StatusBar.currentHeight : 0 }}。
这一步操作起来很简单，直接把生成的代码粘贴进VS Code，用Ctrl+F搜“StatusBar”，按上述规则修改即可。
接入埋点与用户行为日志
你已在项目中集成了Sentry和自研埋点SDK，要求首页每个交互都触发对应事件。
① 轮播图点击事件：在FlatList的onPress回调里插入 logEvent('banner_click', { banner_id: item.id })
② 商品卡片点击：同理，在TouchableOpacity onPress中加 logEvent('product_click', { product_id: item.id, position: index })
③ TabBar切换：用 navigation.addListener('state', ...) 监听，触发 logEvent('tab_switch', { from: prev, to: current })
第四步：确认所有 logEvent 调用前都有 const { logEvent } = useContext(AnalyticsContext) ——【如果生成代码没引入这个Context，必须手动补上】
