Vue使用Viewer时报错container必须为字符串或HTMLElement如何解决

• Vue3组合式API写法错误
  如果你使用Vue3组合式API，通过ref()声明的DOM引用取值时必须加.value，如果直接传递mlyRef而非mlyRef.value，实际传入的是ref响应式对象而非真实DOM，就会触发该错误。
• 代码执行时机错误
  MVVM框架中$refs仅在组件挂载完成（对应Vue生命周期mounted/onMounted）后才会被赋值为真实DOM元素。如果代码执行在created生命周期、路由跳转后原组件已卸载、或v-if控制该div为隐藏状态时，this.$refs.mlyRef实际为undefined/null，若此时绕过判断执行实例化逻辑就会报错。
• 类型判断失效
  两种场景会导致instanceof HTMLElement判断不准：
  1. 逻辑运行在iframe中时，当前上下文的HTMLElement构造函数和DOM所属iframe的HTMLElement不是同一个引用，会出现判断结果和实际类型不符的情况
  2. 服务端渲染(SSR)场景下，服务端不存在HTMLElement全局对象，判断逻辑在服务端执行时返回异常真值，客户端执行实例化时传入的不是真实DOM
• 跨端框架兼容问题
  如果使用uni-app、Taro等跨端编译框架，在非H5端（小程序、APP端）$refs返回的是框架模拟的DOM代理对象，不是标准HTMLElement实例，不满足Viewer入参要求。
• 引用绑定对象错误
  如果ref绑定的是自定义组件而非原生div标签，默认拿到的是组件实例而非内部DOM元素，也会触发类型错误。

内容的提问来源于stack exchange，提问作者Vitor Venancio