小编Hon*_*fus的帖子

React - 使用TypeScript vs Flow vs?

我正在学习React,我想我很了解它.然而,有一件事困扰我关于开发强大的React应用程序 - 开发人员使用什么工具进行静态类型检查?

我非常喜欢TypeScript.由于类型检查和其他简洁的功能,我认为它可以减少开发JavaScript应用程序的痛苦.Visual Studio Code还提供了非常好的代码完成.我知道,我可以把它与利用工作做出反应分型 + DenifitelyTyped.

问题是,关于使用React + TypeScript的教程并不多.似乎也没有很多关于使用这个组合进行开发的文章.另一方面,许多人似乎正在使用Flow,这是一个由Facebook支持的项目(我猜他们也使用它).

我已经设法找到关于Reddit讨论,其中有关于使用React + TypeScript/React + Flow方式的优点和缺点.然而,对我来说,它似乎已经过时了,因为它现在已经有10个月了.我认为从那以后发生了很多变化.

我还发现了两篇关于使用React + FlowReact + TypeScript的文章.作者陈述了他在使用这两个选项时遇到的一些问题,并得出结论:TypeScript是"现在最好的选择"(2015年11月),特别是因为Flow项目有很多问题并且从Facebook获得的开发人员活动很少.他还提到它与巴贝尔不相称?

所以,我想的问题是:是否可以安全使用做出反应+打字稿组合,否则我会碰到一些困难?Flow怎么样?我应该检查一些其他类似的工具吗?你会推荐哪种方法?

2017年9月更新:

拥有超过一年的日常使用TypeScript经验,并在一段时间内使用Flow,我得出以下结论:

  • 今天使用TypeScript仍然很痛苦.问题是JavaScript世界的移动速度太快以至于TypeScript一直落后.考虑使用那个花哨的新ES7第3阶段功能?不,你不能.希望获得某些库的最新版本的类型提示?等一两个月,也许更多......
  • 流程已经走了很长一段路,它已经得到了很大的改进,它可以捕获一些TS不能的东西.最重要的是,它最终适用于Windows.此外,还有很棒的VS Code插件(不知道为什么它只有3/5的评级).它使用React Native 100%工作,TypeScript甚至还不到50%.
  • 大多数情况下,您根本不需要类型.所有额外的打字很少值得.JS是一种动态类型语言,克服它:)

TL; DR:如果您打算使用任何类型检查器,我建议使用Flow.

2019年2月更新:

我相信上面的建议已经过时,不再相关.三个原因:

因此,我认为TypeScript比2019年的Flow更加务实.

至于是否值得使用任何类型的检查器,我会说这取决于项目的大小.小项目可能不需要它.

javascript typescript reactjs flowtype babeljs

48
推荐指数
2
解决办法
1万
查看次数

将IntelliJ键绑定导入Xcode

Xcode的键盘图是否与JetBrains的产品相同?(IntelliJ键映射)

我尝试使用谷歌搜索,但谷歌在这种情况下是完全无用的,因为它在搜索"将intellij键绑定到xcode"时,以相反的方式呈现结果(将Xcode键映射导入IntelliJ产品).

我不想看到自己手动重新分配所有绑定:)

macos xcode keymapping intellij-idea key-bindings

23
推荐指数
2
解决办法
880
查看次数

TextInput阻止ScrollView滚动

我有一个比手机屏幕高度更长的表格.它是一个ScrollView包含TextInput组件.问题是,当我想拖动开始触摸a时TextInput,ScrollView不会移动.如果我在一个空白区域(View代码示例中)上拖动,它会完美滚动.

感觉就像在TextInput某种程度上吃了触摸/拖动事件,不允许ScrollView交互.

ScrollView类似于此:

function Form() {
    return (
        <ScrollView style={{ flex: 1, }}>
            <TextInput placeholder="test" />
            <TextInput placeholder="test" />
            <TextInput placeholder="test" />
            <TextInput placeholder="test" />
            <TextInput placeholder="test" />
            <View style={{ height: 150, }} />
            <TextInput placeholder="test" />
            <TextInput placeholder="test" />
            <TextInput placeholder="test" />
            <TextInput placeholder="test" />
        </ScrollView>
    );
}
Run Code Online (Sandbox Code Playgroud)

如何进行滚动工作?

更新:我注意到当我开始在空白区域滚动时,我可以通过触摸输入继续滚动.但是,一旦惯性停止,我就无法再次使用输入滚动.

react-native react-native-scrollview react-native-android

11
推荐指数
1
解决办法
2339
查看次数

扩展 Material UI ListItem 的正确方法是什么?

我正在使用 TypeScript 3.4.5 和 Material UI 4.2 以及以下代码:

interface MyItemProps {
    name: string;
    value: string;
}

function Item({ name, value, ...props }: ListItemProps<'li', MyItemProps>): ReactElement {
    return (
        <ListItem {...props} className="item">
            <ListItemText primary={name} secondary={value || '-'} />
        </ListItem>
    );
}
Run Code Online (Sandbox Code Playgroud)

我收到Type 'boolean' is not assignable to type 'true'错误。为什么?

我一直在研究 的类型定义ListItem,但我无法弄清楚发生了什么:

export interface ListItemTypeMap<P, D extends React.ElementType> {
  props: P & {
    alignItems?: 'flex-start' | 'center';
    autoFocus?: boolean;
    button?: boolean;
    ContainerComponent?: React.ElementType<React.HTMLAttributes<HTMLDivElement>>;
    ContainerProps?: React.HTMLAttributes<HTMLDivElement>;
    dense?: boolean; …
Run Code Online (Sandbox Code Playgroud)

javascript typescript reactjs material-ui

7
推荐指数
1
解决办法
411
查看次数

React + React Native入门套件

我将使用React和React Native开发一个web +移动应用程序.我想在React和React Native之间共享尽可能多的代码.我正在寻找一些入门套件,但只找到este.然而,对我来说,它似乎是一种矫枉过正,因为它有太多的依赖关系(我也无法让它适用于Android - 当我修复一些错误时,我会遇到另一个错误).

我想只有React + React Native + Redux + web捆绑等等.还有其他选择吗?或者至少我可以使用非常简单的示例应用程序?

reactjs react-native redux

5
推荐指数
1
解决办法
739
查看次数

无法请求令牌,请求字段为空

我正在尝试为 SPA 创建 API。我正在使用最新的 .NET Core、MVC 和 EF。我想使用 JWT 对用户进行身份验证,因此我决定使用 openiddict 核心。我尝试根据github 页面这篇博客文章中的示例进行设置。问题是我收到“不支持指定的授权类型”。当请求令牌时。

Here's screenshot of postman request: 邮递员请求

Here's my ConfigureServices method:

public void ConfigureServices(IServiceCollection services)
{
    // Add framework services.
    services.AddApplicationInsightsTelemetry(Configuration);

    services.AddMvc();

    services.AddDbContext<ApplicationDbContext>(
        options => options.UseSqlServer(Configuration["Data:DefaultConnection:ConnectionString"])
    );

    services.AddIdentity<ApplicationUser, ApplicationRole>()
        .AddEntityFrameworkStores<ApplicationDbContext>()
        .AddDefaultTokenProviders();

    services.AddOpenIddict<ApplicationDbContext>()
        .UseJsonWebTokens()
        .EnableTokenEndpoint("/connect/token")
        .AllowPasswordFlow()
        .DisableHttpsRequirement()  // TODO: remove in production
        .AddEphemeralSigningKey();  // TODO: replace with a certificate, this should be used for development only
}
Run Code Online (Sandbox Code Playgroud)

And the Configure method:

public void Configure(IApplicationBuilder app, IHostingEnvironment …
Run Code Online (Sandbox Code Playgroud)

jwt asp.net-core openiddict

4
推荐指数
1
解决办法
392
查看次数

如何从JavaScript调用本机视图方法

我有一个Android类,它扩展了SimpleViewManager类并封装了一个MapView.从React Native JavaScript类设置道具就像一个魅力(使用@ReactProp注释).但是,我希望能够在视图上调用方法,如下所示:

public void centerToMyLocation(MapView view) {
    view.getController().setCenter(myLocation);
}
Run Code Online (Sandbox Code Playgroud)

我已经尝试使用@ReactMethod注释,获取MapViewJavaScript中的参考,然后centerToMyLocation在该对象上调用该方法.但它不起作用(我得到mapViewRef.centerToMyLocation is not a function错误).

如何从我呈现本机MapView组件的JavaScript类中调用该方法?

react-native react-native-android

1
推荐指数
1
解决办法
3319
查看次数