iview抽屉（transfer = false，inner = true）显示在IE10的外部而不是内部

Question

在Chrome中也可以，但IE11也可以

在设置了“传输”（false）和“内部”（true）的情况下，抽屉的工作方式如下：

  

https://run.iviewui.com/prdkRwyB

normally effect

使用IE10时出现问题

抽屉在标签中显示的是外部，而不是内部。

abnormally effect

并且抽屉的html代码已置于其父标记之外

Answer 1

如果使用F12开发人员工具检查HTML和CSS，您会发现抽屉在iview卡主体外部，看来此问题与iView有关，您可以联系他们并反馈此问题。

IE 11中的屏幕截图：

IE 10中的屏幕截图：

Answer 2

我找到了问题的解决方案。（iview 3.2.2）

  

iview / src / directives / tansfer-dom.js

此js文件处理DOM传输作业，这导致抽屉面板从父DOM传输出去。

inserted (el, { value }, vnode) {
        if ( el.dataset && el.dataset.transfer !== 'true') return false;
        el.className = el.className ? el.className + ' v-transfer-dom' : 'v-transfer-dom';
        const parentNode = el.parentNode;
        if (!parentNode) return;
        const home = document.createComment('');
        let hasMovedOut = false;

        if ( value !== false) {
            parentNode.replaceChild(home, el); // moving out, el is no longer in the document
            getTarget(value).appendChild(el); // moving into new place
            hasMovedOut = true
        }
        if (!el.__transferDomData) {
            el.__transferDomData = {
                parentNode: parentNode,
                home: home,
                target: getTarget(value),
                hasMovedOut: hasMovedOut
            }
        }
    },

显示为文件

  

if（value！== false）

第9行的判断不正确。

替换下面的代码并通过运行'npm run dist'重建iview，

  

if（value && value！== false）

抽屉在IE10中显示良好