В настоящее время я использую следующий код для аннотирования деструкции объекта (inline)
Я хотел бы знать, есть ли более сжатая форма, например, без использования встроенной аннотации.
Не могли бы вы привести мне пример?
// @flow
import React from 'react'
import moment from 'moment'
import IconWeather from '../../shared/icon/IconWeather'
const ForecastDay = ({ date, tempMin, tempMax, iconCode, weatherDescription }:{+date:Date, +tempMin: number, +tempMax: number, +iconCode:string, +weatherDescription:string }) => {
const dateFormat = moment.unix(date).format('ddd, MMM D')
const tempMinRounded = Math.round(tempMin)
const tempMaxRounded = Math.round(tempMax)
return (
<div>
<div>{dateFormat}</div>
<div>
<IconWeather code={iconCode} />
</div>
<div>
<div>
{tempMinRounded}°
</div>
<div>
{tempMaxRounded}°
</div>
</div>
<div>
{weatherDescription}
</div>
</div>
)
}
export default ForecastDay
Я нашел возможное решение, разделяющее аннотацию на отдельный тип.
Если у вас есть лучшее решение, пожалуйста, сообщите мне, я хотел бы узнать больше.
Код, который я использую:
// @flow
import * as React from 'react'
import moment from 'moment'
import IconWeather from '../../shared/icon/IconWeather'
/* eslint-disable no-undef */
type PropsType = {
date: number,
+tempMin: number,
+tempMax: number,
+iconCode:number,
+weatherDescription:string
}
/* eslint-enable no-undef */
const ForecastDay = ({ date, tempMin, tempMax, iconCode, weatherDescription }:PropsType) => {
const dateFormat = moment.unix(date).format('ddd, MMM D')
const tempMinRounded = Math.round(tempMin)
const tempMaxRounded = Math.round(tempMax)
return (
<div>
<div>{dateFormat}</div>
<div>
<IconWeather code={iconCode} />
</div>
<div>
<div>
{tempMinRounded}°
</div>
<div>
{tempMaxRounded}°
</div>
</div>
<div>
{weatherDescription}
</div>
</div>
)
}
export default ForecastDay