組件沒有定義

所以我想用反應js建立一個asp.net核心1.0項目。我按照以下tutorial設置項目。我正在嘗試構建和使用我的第一個組件。我唯一的區別是我使用了ES6腳本，而不是顯示教程中的舊語法。這是我的代碼。組件沒有定義

Startup.cs

public void ConfigureServices(IServiceCollection services) 
    { 
     // Add framework services. 
     services.AddSingleton<IHttpContextAccessor, HttpContextAccessor>(); 
     services.AddReact(); 
     services.AddMvc(); 
    } 

    public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory) 
    { 
     loggerFactory.AddConsole(Configuration.GetSection("Logging")); 
     loggerFactory.AddDebug(); 

     if (env.IsDevelopment()) 
     { 
      app.UseDeveloperExceptionPage(); 
      app.UseBrowserLink(); 
     } 
     else 
     { 
      app.UseExceptionHandler("/Home/Error"); 
     } 
     app.UseReact(config => 
     { 
      // If you want to use server-side rendering of React components, 
      // add all the necessary JavaScript files here. This includes 
      // your components as well as all of their dependencies. 
      // See http://reactjs.net/ for more information. Example: 
      //config 
      // .AddScript("~/Scripts/First.jsx") 
      // .AddScript("~/Scripts/Second.jsx"); 

      // If you use an external build too (for example, Babel, Webpack, 
      // Browserify or Gulp), you can improve performance by disabling 
      // ReactJS.NET's version of Babel and loading the pre-transpiled 
      // scripts. Example: 
      //config 
      // .SetLoadBabel(false) 
      // .AddScriptWithoutTransform("~/Scripts/bundle.server.js"); 
     }); 
     app.UseStaticFiles(); 

     app.UseMvc(routes => 
     { 
      routes.MapRoute(
       name: "default", 
       template: "{controller=Home}/{action=Index}/{id?}"); 
     }); 
    }

查看/ _Viewimports.chtml

@using ReactTest 
    @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers 
    @using React.AspNet

首頁/ Index.cshtml

@{ 
Layout = null; 
} 
<html> 
<head> 
    <title>Hello React</title> 
</head> 
<body> 
<div id="content"></div> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.2/react.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.2/react-dom.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/remarkable/1.7.1/remarkable.min.js"></script> 
<script src="@Url.Content("~/js/tutorial.jsx")"></script> 
</body> 
</html>

/js/tutorial.jsx

class App extends Component { 
    render() { 
     return (<div>test</div>); 

    } 

} 
ReactDOM.render(<App/>,document.getElementById('content'));

問題是我得到錯誤'未捕獲的ReferenceError：組件未定義'。如果我嘗試導入反應，ReactDOM在tutorial.jsx我得到的錯誤「未捕獲的SyntaxError：意外的標記進口」

來源

2017-09-27 Sujit.Warrier

在你的代碼「組件」應被定義爲「React.Component」

class App extends React.Component { 
    render() { 
     return (<div>test</div>); 
    } 
} 

ReactDOM.render(<App/>, document.getElementById('content'));

來源

2017-09-27 16:35:00

謝謝人。不能相信我錯過了這麼簡單的事情。 –

組件沒有定義

回答

相關問題