首页 > 解决方案 > 打字稿将任何类型转换为类型

问题描述

相关:

在 TypeScript 箭头函数中指定返回类型

为什么我收到错误“对象文字只能指定已知属性”?

在:

hooks/Test.tsx

import { useState, useEffect } from 'react'

interface GeoLocationData {
    isGeoLocationDataSet: boolean
    lat: string
    lon: string
    errorCode: number,
    errorMsg: string
}

export const Test = (): GeoLocationData => {
    const [geoLocationData, setGeolocationData] = useState<GeoLocationData>({
        isGeoLocationDataSet: false,
        lat: '',
        lon: '',
        errorCode: 0,
        errorMsg: ''
    });

    // stuff here
    return geoLocationData
}

geoLocationDataGeoLocationData在另一个组件中使用时不强制转换为类型:

import React from 'react';
import './App.css';
import { Test} from './hooks/Test';

function App() {
  const geoLocation = Test
  return (
    <div className="App">
      <body className="App-body">
        <p>
          {geoLocation.isGeoLocationDataSet
            ? JSON.stringify(geoLocation)
            : "No"}
        </p>
      </body>
    </div>
  );
}

export default App;

呃:

Property 'isGeoLocationDataSet' does not exist on type '() => GeoLocationData'.ts(2339)

isGeoLocationDataSet确实作为道具存在于GeoLocationData.

以下()

export const Test = (): GeoLocationData => ({
    const [geoLocationData, setGeolocationData] = useState<GeoLocationData>({
        isGeoLocationDataSet: false,
        lat: '',
        lon: '',
        errorCode: 0,
        errorMsg: ''
    });

    // stuff here
    return geoLocationData
})

产生:

Type '{ const: [GeoLocationData, React.Dispatch<React.SetStateAction<GeoLocationData>>]; return: any; }' is not assignable to type 'GeoLocationData'.
  Object literal may only specify known properties, and 'const' does not exist in type 'GeoLocationData'.

但回报仍然是一个。

标签: javascriptreactjstypescript

解决方案


Test是一个函数,所以你需要调用它来获取 type 的返回值GeoLocationData

const geoLocation = Test();

推荐阅读