反应与反应DOM混淆 [英] react vs react DOM confusion

查看:91
本文介绍了反应与反应DOM混淆的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在将ES6 babel与react一起使用,现在对于较新版本的react,react DOM不再是它的一部分.我对以下代码的怀疑是,第一行是否需要?因为我无处需要React,但最后一行需要ReactDOM.

I'm using ES6 babel with react, and now for the newer version react, react DOM is not a part of it anymore. My doubt for below code is that, is it the first line require? since nowhere I need React, but the last line I need ReactDOM.

const React = require('react')
const ReactDOM = require('react-dom')

const App = () => {
    return (
        <div className='app-container'>
            <div className='home-info'>
                <h1 className='title'>sVideo</h1>
                <input className='search' type='text' placeholder='Search' />
                <button className='browse-all'> or Browse All</button>
            </div>
        </div>
    )
}

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

从版本 0.14 开始的

推荐答案

反应分为两部分:反应 ReactDOM.您正在使用 ReactDOM来呈现HTML元素.因此,在您的组件中 import ReactDOM 绝对对您有意义.但是就React而言,尽管您不是直接使用React,而是间接使用它,因为您在 return语句中编写的任何内容都将被转换为React.createElement 函数,该函数将创建实际的DOM元素.

React from version 0.14 onwards is split into two parts: React and ReactDOM. You are making use of ReactDOM to render you HTML element. So it definitely makes sense for you to import ReactDOM in your Component. But as far as React is concerned although you are not making use of React directly but it is indirectly being used because whatever you write in your return statement will be transpiled into React.createElement function that will create the actual DOM elements.

现在,如果您在代码中省略React,您将看到此消息,您将看到一个错误

Now you can see this if you omit React in your code, you will see an error that

不存在反应

,它将为您提供 React.createElement无法识别的反应.希望您理解它.

and it will give you that React is not recognised in React.createElement. Hope you understood it.

这篇关于反应与反应DOM混淆的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆