vue 项目使用ref获取页面元素,怎么讲起拼接到字符串中
时间: 2023-11-27 13:51:38 浏览: 111
Vue获取页面元素的相对位置的方法示例
在 Vue 中使用 ref 可以获取到页面中的元素,可以通过 `$refs` 对象来访问这些元素。如果你想将获取到的元素的 ref 名称拼接到字符串中,可以使用如下方式:
```html
<template>
<div>
<input ref="input1" />
<input ref="input2" />
</div>
</template>
<script>
export default {
mounted() {
// 将 ref 名称拼接到字符串中
const inputName = 'input1';
const inputElement = this.$refs[inputName];
console.log(inputElement);
}
}
</script>
```
在上面的示例中,我们将 `input1` 的 ref 名称拼接到字符串中,并通过 `this.$refs[inputName]` 来获取到对应的元素。注意,拼接的 ref 名称应该和模板中定义的一致。
阅读全文