温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

react.js能和ts一起用吗

发布时间:2026-10-08 16:37:30 来源:亿速云 阅读:91 作者:小樊 栏目:编程语言

可以的,React.js 完全可以和 TypeScript(TS)一起使用,而且这现在是非常主流、推荐的做法。

1. 为什么 React + TS 很常见?

  • 类型安全:组件的 props、state、事件对象都有类型提示,减少运行时错误
  • 更好的开发体验:IDE 自动补全、重构更方便
  • 更适合中大型项目:团队协作时更清晰、可维护

2. 怎么用?

创建项目(最简单)

# 使用 Vite
npm create vite@latest my-app -- --template react-ts

# 或使用 CRA(已不推荐新项目使用)
npx create-react-app my-app --template typescript

基本写法示例

import React from 'react';

type Props = {
  name: string;
  age?: number;
};

const Hello: React.FC<Props> = ({ name, age }) => {
  return (
    <div>
      Hello {name}, age: {age ?? 'unknown'}
    </div>
  );
};

export default Hello;

3. 常见注意点

  • 文件后缀用 .tsx(不是 .jsx)
  • 事件类型如 React.ChangeEvent<HTMLInputElement>
  • useState 会自动推断类型,也可以显式指定:
    const [count, setCount] = useState<number>(0);
    

4. 总结

✅ React + TypeScript = 官方支持
✅ 生态成熟(antd、MUI 等都支持 TS)
✅ 新项目强烈推荐用 TS

如果你愿意,我也可以帮你把一段 JSX 代码改成 TSX,或者讲 React + TS 的常见坑。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI
助
手