时间戳

首页 > 解决方案 > 哪种语法对 React 更典型，如果有的话（版本 16）？

javascript - 哪种语法对 React 更典型，如果有的话（版本 16）？

问题描述

我对 React 很陌生，我看到了很多语法略有不同的示例。由于我的无知和无能，我无法分辨哪些更合适，哪些是像我一样困惑的人的创造。另外，我可以想象这些变化是由于库的不同版本造成的。

我确实理解以下两个示例在 JS 术语中的区别，但我想知道是否有任何罢工不适合 React 应用程序。或者，可能，如果没有人能说出来，那么无论哪种方式都是完全可以接受的。

显式导入

import * as React from "react";
import { render, version }  from "react-dom";
import MainArea from "./components/MainArea";

const ver = version;
render(<MainArea />, document.getElementById("app"));

隐式导入

import * as React from "react";
import * as ReactDOM from "react-dom";
import MainArea from "./components/MainArea";

const ver = ReactDOM.version;
ReactDOM.render(<MainArea />, document.getElementById("app"));

标签： javascriptreactjssyntax

解决方案

我已经看到并使用了这两种导入方式。对于我正在积极更改的代码，我倾向于使用隐式导入。在您导入的模块中添加内容时，您不必重复自己。

例如，替换

import {
    action1,
    action2,
    ...,
    actionN
} from './actions';

和

import * as actions from './actions';

意味着您只需要添加一个动作./actions.js而不是添加该动作，然后显式引用它。

作为经验法则：更喜欢相关模块不经常更改的显式导入，并且更喜欢在命名空间中导入>3个名称的隐式导入，或者您预计对该模块进行定期更改。

推荐阅读