反應不渲染簡單組件

Question

我是React的新手，所以這個問題。 我正在嘗試渲染一個基本的React組件。 這是我的index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>React</title>
  </head>
  <body>

    <div id="root"></div>
    <script src="/bundle.js"></script>
  </body>
</html>

這是我的index.js

import React from 'react';
import 'babel-polyfill';
import { render } from 'react-dom';
import './styles/style.css';
import  '../node_modules/bootstrap/dist/css/bootstrap.min.css';
import Layout from './components/Layout';

React.render(<Layout />, document.getElementById("root"));

這是我的布局組件。

import React from 'react';
import {render } from 'react-dom';

class Layout extends React.Component{
  render(){
    return(
      <div className="container-fluid">
        <div className="jumbotron">
          <h1>This is home now</h1>
        </div>
      </div>
    );
  }
}
export default Layout;

這是我在控制台上看到的錯誤，

Uncaught TypeError: _react2.default.render is not a function

啟動開發服務器時，我看到一個空白頁面，沒有呈現任何內容。 任何幫助表示贊賞。

Answer 1

從react-dom導入index.js內的render函數的方式會更改調用它的方式。

import { render } from 'react-dom';

在這里，您只需從react-dom對象導入render方法。 所以要使用它，你會說

render(<Layout />, document.getElementById("root"));

反應不渲染簡單組件

問題描述

1 個解決方案

解決方案1
2 已采納 2016-10-26 21:18:11

反應不渲染簡單組件

問題描述

1 個解決方案

解決方案1 2 已采納 2016-10-26 21:18:11

解決方案1
2 已采納 2016-10-26 21:18:11