开发者问题收集

如何修复“对象可能未定义”?

2019-07-31
961

我在一个 typescript 文件中有一个函数,除了经过 if 检查之后仍然存在:“对象可能‘未定义’”之外,其他一切都运行正常。

我在其他文件中也有类似的代码片段,但是都没有出现同样的问题。

函数:

renderCities = (countries: Country[], countryId: string) => {
    if (countryId === 'DEFAULT') {
      return <option>Select Country First</option>;
    } else {
      if (countries) {
        return countries //error here "Object is possibly 'undefined'"
          .find((country: Country) => country.id === parseInt(countryId))
          .cities.map((city: City) => (
            <option key={`city-${city.id}`} value={city.id}>
              {city.name}
            </option>
          ));
      }
    }
  };

接口:

interface City {
  name: string;
  id: number;
}

interface Country {
  name: string;
  id: number;
  cities: City[];
}

另一个类似的代码:

<Query<Data> query={GET_COUNTRIES_CITIES}>
        {({ error, loading, data }) => {
          if (loading) {
            return <h1>Loading...</h1>;
          } else if (error) {
            throw new Error('Error');
          } else {
            if (data) {
              return <TeacherForm countries={data.countries} />;
              //there used to be the same error in "data.countries", but the 
              //if (data) fixed it.
            }
          }
        }}
      </Query>

我期望 if (countries) 能够消除对象未定义的可能性,但是它并没有这样做。

1个回答

您可以省略 if 子句 if (countries) { ... ,这不是必需的。

下一个表达式可能未定义:

countries.find((country: Country) => country.id === parseInt(countryId))

,它返回 Country | undefined 。这里必须处理 undefined 的情况。

ford04
2019-07-31