Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | 1x 27x 77x 77x 77x 22x 77x 27x 55x 27x 1x | import React, { useMemo } from 'react'; import PropTypes from 'prop-types'; const CreateElement = ({ items, components = {} }) => { const renderItem = (item, i) => { const { _tag, _children, ...rest } = item const Tag = components[_tag] || _tag const children = _children ? _children.map((child, i) => { return typeof child === 'object' ? renderItem(child, i) : child }) : '' return <Tag key={Tag + i} {...rest}>{children}</Tag> } const generatedItems = useMemo(() => { return items && items.map((item, i) => renderItem(item, i)) }, [JSON.stringify(items)]) return ( <React.Fragment> {generatedItems} </React.Fragment> ) } // items: PropTypes.oneOfType[PropTypes.array, PropTypes.object], CreateElement.propTypes = { components: PropTypes.object }; export default CreateElement; |