在vue和typescript中按id获取元素

我正在尝试使用vuejs按id获取dom元素。问题是我不知道如何访问这个元素。我在用这个。$refs。当我编写console.log（this.$refs）时，我会看到以下内容：

但是，当我编写console.log（这是$refs.gauge2）时，我看到未定义。 有人知道如何访问此元素吗？ 这是我的代码：

从“Vue”导入Vue
var Gauge=require（'svg-Gauge'））
导出默认Vue.extend({
组成部分：{
},
创建（）{
console.log（this.$refs）
console.log（此.$refs.$gauge2）
变量元素=此。$refs.gauge2
var仪表2=仪表(
元素{
最低：-50，
最高：50，
拨号：180，
拨号角度：0，
价值：50
}
);
},
})

.二

您可以通过以下方式完成：

this.$refs.gauge2.$el.id

通过将触发器更改为已安装的（）挂钩：

---

如果您得到

undefined

值，原因是

console.log

命令是在将

ref

（gauge2）分配给此元素之前运行的。

我通过更改mounted创建的方法修复了它。现在它工作了，谢谢

您的问题是，您试图从创建的方法访问ref，该方法在模板呈现之前被调用。 只有在呈现模板后才能访问引用，我建议使用mounted函数

有关更多信息：

编辑 请看这张来自Vue.js官方网站的照片：

---

您能在调用控制台.log（this.$refs.gauge2）的地方包含代码吗？？如果我写下此代码，会出现以下类型脚本错误：TS2339:类型“Vue | Element | Vue[]| Element[]上不存在属性“id”。类型“Vue”上不存在属性“id”。我收到相同错误：TS2339:类型“Vue | Element | Vue[]| Element[]”上不存在属性“$el”。类型“Element”上不存在属性“$el”。可能是加载程序有问题？请尝试更改为mounted（），而不是created（），并请将console.log（this.$refs.gauge2）的结果粘贴到此处。那么，如果可以的话，您为什么需要id？我建议您阅读文档中的Vue生命周期页面，以避免其他类似错误：

this.$refs.gauge2.id