ts非空断言作用让ts排除null和undefined 作用让ts排除null和undefined 作用让ts排除

作用

让ts排除null和undefined

用法示例

const containerRef = ref<HTMLDivElement>()
// 当我们能确保containerRef.value一定存在时
// 如果使用非空断言
console.log(containerRef.value!.offsetHeight)
// 如果不使用非空断言，我们需要先进行一次判断
if(containerRef.value){
 // 其他代码
 console.log(containerRef.value.offsetHeight)
}

什么时候使用?

const containerRef = ref<HTMLDivElement>()
function validateContainerRefExists(){
    // 通常这个判断方法中有很复杂的判断逻辑
    return containerRef.value
}
if(validateContainerRefExists()){ // ts并不能通过函数的执行结果得出containerRef.value存在的推导，所以此时如果使用containerRef.value ts还是会认为可能为undefined，所以需要使用非空断言
    console.log(containerRef.value!.offsetHeight)
}