vue3中const arr=ref([]) 和 const arr=[] as any 赋值之后获取

文章讲述了在Vue3中,使用`ref([])`创建的响应式数组与直接声明`[]asany`的不同之处。前者能自动追踪数组变化,后者虽然类型更灵活但需通过`.value`访问,否则可能导致错误。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

今天把const arr=ref([]) 写成了 const arr=[] as any,导致明明有数据但是怎么也获取不到,搜了一下原来...

const arr=ref([]) 和 const arr=[] as any 的区别在于:

1) const arr=ref([]):这里使用了 Vue 3 的 ref 函数,将一个空数组 [] 包装成一个响应式对象。当数组发生变化时,Vue 会自动追踪这些变化并更新视图。

2) const arr=[] as any:这里创建了一个空数组 [],并使用类型断言 as any 将其指定为任意类型。这样做的目的是告诉 TypeScript,这个变量可以存储任何类型的值,但实际上它仍然是一个数组。这种情况下,Vue 不会自动追踪数组的变化。

赋值时都使用arr.value=[1,2,3],那么在html中显示内容的时候,“const arr=ref([])”可以直接获取到arr[0]、arr[1]、arr[2]的值显示1、2、3;而“const arr=[] as any”则需要通过arr.value[0]、arr.value[1]、arr.value[2]来显示1、2、3,若直接arr[0]则会报错,因为arr是一个空数组

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值