React.createElement 与 textNode

时间:2021-06-28 07:24:16

标签: javascript reactjs

index.js

import React from './miniReact/react.js';
const style = {border:'3px solid red', margin:'5px'}
const element = (
  <div id='A1' key='A1' style={style}>
    A1
    <div id='B1' key='B1' style={style}>
      B1
      <div id='c1' key='c1' style={style}> C1</div>
      <div id='c2' key='c2' style={style}>C2</div>
    </div>
    <div id='B2' key='B2' style={style}>
      B2
    </div>
  </div>
)
------------------------------------------
react.js:

const ELEMENT_TEXT = Symbol.for('ELEMENT_TEXT')

function createElement(type, props, ...children) {
    
    return {
        type,
        props: {
            ...props,
            children: children.map(child => {
                
                return typeof child === 'object' ? child : createTextNode(child)
            })
        }
    }
}

function createTextNode(textNode) {
    return {
        // ELEMENT_TEXT: A1: <div>A1</div>
        type: ELEMENT_TEXT,
        props: {
            text: textNode,
            children: []
        }
    }
}

问题: https://i.stack.imgur.com/2gpIq.png

当我使用我的 React.createElement 时,我遇到了此图像中显示的问题 (https://i.stack.imgur.com/2gpIq.png),我遇到了一个问题,即“A1”应该是具有对象类型的节点。但是,它仍然是一个文本节点。似乎 children.map 函数不起作用。那么,你能给我一些关于这个问题的答案吗?谢谢。

0 个答案:

没有答案
相关问题