为什么状态在React TypeScript中首先返回空&属性不存在于类型'never‘上？

在React TypeScript中，当我们定义一个组件的状态（state）时，我们需要指定状态的初始值和类型。在某些情况下，当我们尝试在状态中返回一个空值时，TypeScript会报错并提示属性不存在于类型'never'上。

这是因为在React TypeScript中，状态的类型是通过泛型参数来定义的。当我们没有明确指定状态的类型时，TypeScript会默认将其推断为never类型，即表示永远不会有值的类型。因此，当我们尝试返回一个空值时，TypeScript会认为该属性不存在于never类型上，从而报错。

为了解决这个问题，我们需要明确指定状态的类型。可以使用React.FC（函数组件）或React.Component（类组件）来定义组件，并通过泛型参数指定状态的类型。例如，我们可以使用useState钩子来定义一个状态，并指定其类型为string：

import React, { useState } from 'react';

const MyComponent: React.FC = () => {
  const [myState, setMyState] = useState<string>('');

  // ...

  return (
    // JSX
  );
};

在上述示例中，我们明确指定了myState的类型为string，这样就可以安全地返回一个空值。

对于属性不存在于类型'never'上的问题，我们可以通过检查属性是否存在来避免报错。可以使用条件语句或可选链操作符（?.）来检查属性是否存在。例如：

import React from 'react';

interface MyComponentProps {
  myProp?: string;
}

const MyComponent: React.FC<MyComponentProps> = ({ myProp }) => {
  if (myProp) {
    // 属性存在时的逻辑
  }

  // 或者使用可选链操作符
  const propValue = myProp?.length;

  // ...

  return (
    // JSX
  );
};

在上述示例中，我们通过条件语句和可选链操作符来检查myProp属性是否存在，从而避免了属性不存在于类型'never'上的报错。

总结：在React TypeScript中，当状态返回空值时，属性不存在于类型'never'上的报错是由于没有明确指定状态的类型。我们可以通过明确指定状态的类型来解决这个问题，并使用条件语句或可选链操作符来检查属性是否存在。