diff --git a/src/react/ReactChildren.js b/src/react/ReactChildren.js index bbc07d81edaad3705a3dca0942e1cbc01bff2624..9b61c603f0caf5918014615f9c48f17662e35b39 100644 --- a/src/react/ReactChildren.js +++ b/src/react/ReactChildren.js @@ -1,8 +1,61 @@ function mapChildren(children, func, context) { + let result = []; + let count = 0; //TODO实现此mapChildren方法 - return children; + if (Array.isArray(children)) { // children是数组 + traverseArray(children, func, result, '', count); + } else { // children是个对象 + let replaceChildren = func(children, count++); + let parentKey = children.key; + if (!parentKey) { + parentKey = `.0/.`; + } else { + parentKey = `.$${parentKey}/.`; + } + result = flatReplace(replaceChildren, parentKey); + } + + return result; +} + +function traverseArray (array, func, result, prefix = '', count) { + for (let i = 0; i < array.length; i++) { + let item = array[i]; + if (Array.isArray(item)) { + traverseArray(item, func, result, `${i}:`, count); + } else { + item = { + ...item, + key: item.key ? `.${prefix}$${item.key}/.` : `.${prefix}${i}/.`, + } + let r = flatReplace(func(item, count++), item.key); + result.push(...r); + } + } } +function flatReplace(elements, parentKey) { + if(Array.isArray(elements)) { // 模板是数组 + elements = elements.flat().map((child, index) => { + let key = child.key; + if (!key) { + key = `${index}` + } else { + key = `$${key}` + } + key = parentKey + key; + return { + ...child, + key + } + }); + } else { + elements = flatReplace([elements], parentKey); + } + return elements; +} + + export { mapChildren as map, }; \ No newline at end of file