iview drawer(transfer=false, inner=true ) show in tag outside rather than inside in IE10

Question

Situation is OK in Chrome but also the IE11

With "transfer"(false) and "inner"(true) set, Drawer work as follow link:

https://run.iviewui.com/prdkRwyB

normally effect

Problem occur when using IE10

The drawer show in tag outside rather than inside.

abnormally effect

And The html code of drawer has been place out of its parent tag

Answer 1

I found the problem solution.(iview 3.2.2)

iview/src/directives/tansfer-dom.js

This js file handle the DOM transfer job, which lead to drawer panel transfer out of the parent 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
            }
        }
    },

As file show

if ( value !== false)

The judgment on Line 9 is unappropriated.

After replacing code as below and rebuild the iview by running 'npm run dist'，

if( value && value !== false )

drawer show well in IE10