1

我在 Visual Studio 2015 中有一个简单的 mvc6 站点解决方案。

在我的一个页面中,我有

<script type="text/jsx">
    ReactDOM.render(<h1>Hello, world!</h1>, document.getElementById('react-app-mount'));
</script>

但是组件不渲染。我必须在页面中包含哪些脚本才能使其呈现?我是一个反应的新手。

试图自己解决这个问题时,我对诸如 ' npm, bower, babel' 之类的大量术语感到非常困惑,但我在任何地方都找不到关于如何在 Visual Studio 2015 中使用这些东西的从头开始的不错示例。此外,我发现了以下建议只是不工作。

例如,我读到“你应该运行npm install babel”之类的内容,但没有人提供关于我应该在 Visual Studio 中的哪个位置执行此命令的信息。其他人谈论package.json应该存在于我的解决方案中某处的文件,但它只是不存在。

我真的不明白为什么事情会如此复杂。在过去,当您想使用库时,只需<script>在页面的开头或结尾放置一个元素,就可以使用它。

4

2 回答 2

0

使用 ASP.NET MVC 的正确方法是:

  1. 使用 webpack 将所有 react 组件和 scipts 捆绑到一个文件中:bundle.js

    1.2. 您需要脚本的入口点,第一个脚本将 ReactDOM.render 您的根组件,并且它还将导入此组件: import { App} from "./Components/App";

    1.3. 您的App组件将导入其他组件等

  2. 在视图布局中包含 bundle.js

  3. 不要忘记在视图文件中包含根节点 ("
于 2017-03-31T10:31:43.117 回答
0

您必须导入的脚本是:

<script src="https://unpkg.com/react@latest/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@latest/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>

但这不是正确的做法,它是为了获得 React 的演示。

如果您想开始使用 react,这可能会对您有所帮助。 https://github.com/facebookincubator/create-react-app

于 2017-03-30T22:31:52.057 回答