将Url.Action传递给React JSX文件？

Question

请注意，在实际应用中，您应该生成URL（通过Url.Action调用）在服务器端并将其传递下来，或者使用RouteJ而不是对其进行硬编码。为了简单起见，本教程对其进行了硬编码。我无法在JS本身中做到这一点： <CommentBox url="@Url.Action("Comments")" />,...那么“传递下去”是什么意思？是否只是这样说“在@允许使用的Razor csHtml文件中定义URL”，这是另一种方式吗？<script>   $.CommentsUrl = '@this.Url.Action("Comments", "Home")';<script>... 或者，还有更好的方法？即使我做后者，也无济于事把URL插入这段代码中：ReactDOM.render(    <CommentBox url=??? />,    document.getElementById('content'));

Answer 1

以下代码实际上是在cshtml剃刀页面中完成的。它正在将CommentBox组件呈现到内容div

ReactDOM.render(

    <CommentBox url=??? />,

    document.getElementById('content')

);

由于它在cshtml中，因此您可以执行以下操作：

<div id="content"></div>

<script type="text/javascript">

    ReactDOM.render(

        <CommentBox url='@Url.Action("Comments")' />,

        document.getElementById('content')

    );

</script>

如果仅包括一个js文件，则需要创建一个全局javascript变量并使用它：

CSHTML：

<div id="content"></div>

<script type="text/javascript">

    var commentUrl = '@Url.Action("Comments")';

</script>

外部JS：

ReactDOM.render(

    <CommentBox url={commentUrl} />,

    document.getElementById('content')

);