vue中dialog组件中我这样写为什么这样渲染不出

难道是dialog在未显示状态，抓不到dom的问题吗？

//我拿到数据生成一个二维码
success: (res) => {
let cxt = res
let payCode
if (cxt.status == 1) {
payCode = cxt.data.code_url
$('.qr_container').qrcode({
render: "canvas",
height: 264,
width: 264,
correctLevel: 0,
text: payCode
});
setTimeout(() => {
this.qrcode = true //dialog显示
}, 300)
} else {
this.toast(cxt.detail)
}
},
//这里不行
<el-dialog class="qrcode add-add" title="微信支付" :visible.sync="qrcode" width="370px" center>
<div class="qr_container"></div>
</el-dialog>
//单独写在外面测试是可以的
<div class="qr_container"></div>

回答

是的，没显示dialog就是没有dom

先设置

 this.qrcode = true

再等窗口dom渲染后进行qrcode方法 生成二维码。

先显示弹框让其dom渲染，然后等待其渲染完成再生成qrcode插入

this.qrcode=true
this.$nextTick(()=>{
    // qrcode生成
})