elementui中从Drawer 中打开dialog全部黑屏

Question

elementUi中用到抽屉组件，从右侧弹出，抽屉组件中有一个对话框，点击按钮弹出，但是弹出来后全部是遮罩层。

html:

<div id="app">
    <el-button @click="drawer = true" type="primary" style="margin-left: 16px;">
      点我打开
    </el-button>

    <el-drawer
      title="我是外面的 Drawer"
      :visible.sync="drawer"
      size="50%">
      <div>
       <el-button @click="innerDrawer = true">打开里面的!</el-button>
       <el-dialog title="管理" :visible.sync="innerDrawer" class='mandios'>
         <div>123</div>
                <span slot="footer" class="dialog-footer">
                    <el-button @click="innerDrawer = false">取 消</el-button>
                </span>
            </el-dialog>
      </div>
    </el-drawer>
</div>

Answer 1

dialog加上append-to-body