是什么?操作符的意思

Question

我正在使用react-hook形式，我遇到了?操作符。这是什么意思?这里有一些关于如何使用它的上下文

<span>{errors?.name?.message}</span>

其中errors从useForm()中析构，如下所示

const { register, handleSubmit, formState: { errors } } = useForm();

这是一个完整的表单输入，用于绘制更清晰的图像

<input 
type="text" 
id='name' 
name='name'
{...register('name', {
required: {
value: true,
message: 'Name cannot be empty'
}
})}
placeholder='John Doe' 
className='px-6 w-full rounded-md py-2 text-gray-700 focus:outline-none' 

/>
<span>{errors?.name?.message}</span>

Answer 1

?.是可选的链操作符。这里是MDN参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining

例如，如果你运行下面的代码，你将面对一个错误

a = {}
console.log(a.b.c)

Uncaught TypeError: Cannot read property 'c' of undefined

但是如果您不想添加try-catch，但是可以接受该值不存在，那么您可以执行以下操作

a = {}
console.log(a.b?.c)

这将导致undefined被打印到控制台。访问c时的错误被静默处理。