为什么import React from 'react',React首字母必须大写?

Posted gitnull

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了为什么import React from 'react',React首字母必须大写?相关的知识,希望对你有一定的参考价值。

 

很奇怪的是,明明没有用到 React,但是我不得不 import React。这是为什么?

import React from ‘react‘;
 export default function (props) {      
return (
     <form className="signIn" onSubmit={props.onSubmit}> {/* 登录*/}           
<form className="signIn" onSubmit={props.onSubmit}> {/* 登录*/}
...

 

答:把jsx编译到js需要调用一个函数, 这个函数在React叫React.createElement.

import React from ‘react‘;
const comp = () => (
    <div>something...</div>
);
//...

// 编译 JSX 后:

import React from ‘react‘;
const comp = () => (
    React. createElement(‘div‘, null, ‘something...‘ )
);
//这是个约定熟成,不大写,babel编译会出错

 

 


 

"extends React.Component" 删掉行不行?

答:不行,删掉的话页面就是空白的了。说明自定义标签必须继承 React.Component。试试把 render 函数变成其他名字,也不行。且Welcome首字母要大写!

//import 略

class Welcome extends React.Component { 
  render() {
    return <h1>Hello, Component</h1>;
  }
}

ReactDOM.render(
  <Welcome/>,
  document.getElementById(‘root‘)
)

 

 

以上是关于为什么import React from 'react',React首字母必须大写?的主要内容,如果未能解决你的问题,请参考以下文章

Attempted import error: 'hashHistory' is not exported from 'react-router'.

React 报错 Attempted import error: 'injectGlobal' is not exported from 'styled-components&

如何修复undefined不是一个对象 - 'this.navigation.openDrawer'

第一个react

react-cnode

为什么代码中使用import React from 'react'