vue3|vue3 + ts(typescript) ref 获取单个/多个dom元素
【vue3|vue3 + ts(typescript) ref 获取单个/多个dom元素】template
setup
// 获取单个dom
const inputRef = ref(null);
// 获取多个dom
const arr = ref([]);
const divs = (el: HTMLElement) => {
// 断言为HTMLElement类型的数组
(arr.value as Array).push(el);
// 这样写编译器会抛出错误
// --> Argument of type 'HTMLElement' is not assignable to parameter of type 'never'.
// arr.value.push(el);
};
onMounted(() => {
// 加载完成获取input焦点
inputRef.value && inputRef.value.focus();
// 打印多个ref DOM
console.log(arr);
});
return {
inputRef,
divs,
};
推荐阅读
- typeScript入门基础介绍
- 带你了解类型系统以及flow和typescript的基本使用
- [译文]Domain|[译文]Domain Driven Design Reference（四）—— 柔性设计
- React|React refs和onRefs的使用
- react+typescript+router框架搭建笔记
- 3.UIkit|3.UIkit CoreFoundatin Foundation
- 函数式编程（一）|函数式编程（一） lambda、FunctionalInterface、Method Reference
- MySQL|MySQL 5.7 JSON特性支持
- vue|vue3替代vuex的框架piniajs实例教程
- VUE3中watch和watchEffect的用法详解