繁体   English   中英

使用.net渲染React JS服务器端

[英]Render React JS server side using .net

我在http://reactjs.net/getting-started/tutorial.html上进行了注释教程,并使用.net mvc将其渲染到服务器端。

我有一个现有的mvc应用程序,我在其中重写了页面以进行响应。 我正在尝试使用.net渲染到服务器端,但是在尝试渲染服务器端时出现错误。

Exception Details: React.Exceptions.ReactServerRenderingException: Error while rendering "TopicAnswers" to "react1": TypeError: undefined is not a function
   at React.createClass.render (Script Document [8]:80:39) ->     var answerNodes = this.props.data.map(function(answer){
   at ReactCompositeComponentMixin._renderValidatedComponentWithoutOwnerOrContext (Script Document [2]:7395:34)

这是代码:

在我的MVC视图中:

@Html.React("TopicAnswers", new
{
    initialAnswers = Model,
    url = Url.Action("TopicAnswers", new { id = ViewBag.TopicID }),
})

我的TopicAnswers.jsx文件:

var TopicAnswers = React.createClass({
    getInitialState: function(){
    alert('inside getInitialState: ' + this.props.initialAnswers);       
    return {answers: this.props.initialAnswers};
}

我的ReactConfig.cs文件:

ReactSiteConfiguration.Configuration
                .AddScript("~/Scripts/internal/eusVote/TopicAnswers.jsx");

问题:为什么在提供反应文件服务器端时出现问题?

我收到此错误消息,试图使用.net渲染React jsx文件服务器端:

“ React.Exceptions.ReactServerRenderingException:将“ TopicAnswers”呈现为“ react1”时出错:TypeError:未定义不是函数”

我的问题是在JSX文件中,我仍然有一个名为loadAnswersFromServer的ComponentWillMount。 如果要呈现客户端,这就是您所需要的。 但是,一旦调整了代码以呈现服务器端,就需要注释掉/删除ComponentWillMount,以便它不会尝试在服务器端运行loadAnswersFromServer函数。

使用MVC,数据应从控制器传递到视图,并在@ Html.Render(“ Comment”,new {initialData = Model})中进行引用以进行初始加载。

另外,不要忘记注释掉/删除JSX文件中的React.render(...)行。

alert仅在浏览器窗口上下文中可用。 在服务器上渲染它时,您不能调用与浏览器相关的任何功能。 如果要呼叫它们,则需要对它们进行匀场处理,以使它们在服务器上不会出现故障。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM