aliyun / alibabacloud-alfa

阿里云微前端解决方案
https://aliyun.github.io/alibabacloud-alfa
MIT License
846 stars 83 forks source link

🐛 fix element.append() creates undefined TextNode #76

Open Cweili opened 3 years ago

Cweili commented 3 years ago

fn.call( this, el, ...args ) 写法会被 babel 转换为 fn.call.apply(fn, [this, el].concat(args)) ,

el 为 undefined 时, fn apply 的参数列表为 [undefined] ,

调用 append 时会造成元素被 append 一个内容为 undefined 的 TextNode .

比如下面这种用法

https://github.com/microsoft/vscode/blob/136adbed5bdcbca1510f8e4dd5eacd1f4ea63c49/src/vs/base/browser/dom.ts#L1068

Boelroy commented 3 years ago

问题我明白了 不过感觉解法上有点问题,等我看一下

Boelroy commented 2 years ago

根据如下 DOM API 的几个函数签名:

element.insertBefore(newNode, referenceNode)

element.appendChild(aChild)

element.append(...nodesOrDOMStrings)

其实这里比较会出问题的是在于 append 这个方法, insertBefore, appendChild 都是针对单个 element 做调用 所以并不会出现问题。

append 现在实现应该是有问题的,因为它接受的参数是一组 element. 所以实际上应该把 append 转化成 批量地调用 appendChild 的方法

这里你可以修改一下 对 append 方法的实现。如果着急我来改也行

Cweili commented 2 years ago

感谢回复~

目前我的项目中暂时用这个 PR 的代码修复了这个问题,目前没发现其他问题。

您这边有时间的话可以看下是否有更佳的解决方案,可以随时讨论,再次感谢。