通义灵码编写react代码需先确认编辑器识别为typescript react模式，否则无法解析jsx和hook；支持rfc、react.fc等触发词生成组件；通过jsdoc注释自动补全props类型；可用自然语言重写代码但不自动安装依赖。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
在通义灵码中编写React代码，需要先确保编辑器已正确识别项目为React工程，并启用智能补全与组件生成能力。如果项目未配置tsconfig.json或jsconfig.json，通义灵码可能无法推断JSX语法上下文，导致自动补全失效。
确认通义灵码已激活React支持
打开VS Code → 点击左侧活动栏的通义灵码图标 → 查看右下角状态栏是否显示「React」或「TypeScript React」语言模式。若显示为「JavaScript」或「Plain Text」，需手动切换：右下角点击语言模式 → 选择「TypeScript React」。
这一步不可跳过。若语言模式错误，通义灵码将按纯JS逻辑解析代码，【无法识别JSX标签、props类型或useState/useEffect等Hook调用】，后续所有代码建议都会偏离React规范。
快速生成函数式组件
在任意.tsx文件中，输入以下触发词之一，然后按 Tab 或 Enter：
方法一：输入 rfc → 按 Tab → 自动生成带默认导出的函数组件骨架；
方法二：输入 React.FC → 按 Tab → 插入带泛型Props定义的函数组件模板；
方法三：光标置于空白行，输入「创建一个用户列表组件」→ 按 Ctrl+Enter（Windows）或 Cmd+Enter（Mac）→ 通义灵码将根据语义生成含useEffect模拟API调用、map渲染列表的完整组件。
让通义灵码补全Props类型定义
第一步：在组件上方添加JSDoc注释，明确描述Props结构；
第二步：在注释后换行，输入 interface Props { → 按 Tab；
第三步：通义灵码会基于JSDoc内容自动补全属性名、类型和可选标识。例如写「@param {string} name 用户姓名，必填」，它就会生成 name: string;；若写「@param {number} [age] 用户年龄，可选」，则生成 age?: number;。
注意：必须使用标准JSDoc @param 格式，且参数名要与后续组件签名中一致，否则类型推断会失败。
用自然语言修改现有组件逻辑
选中一段React代码（如一个useEffect块），右键 → 选择「通义灵码 → 重写此代码」；
在弹出框中输入「把API请求改成使用axios，并增加loading状态管理」→ 点击确认；
通义灵码会原地替换代码，插入axios导入语句、loading useState声明，并重构useEffect内部逻辑。该操作会保留原有变量命名习惯，但【不会自动安装axios依赖，需手动运行 npm install axios】。
