如何实现Proptypes

问题描述 投票:0回答:1

我是新来的反应所以要善待:)

只需尝试获得要验证的道具类型。我没有在控制台中看到任何错误。我花了很多时间,似乎无法超越这个。任何援助将不胜感激。代码如下:

import PropTypes from 'prop-types'
import { MdTerrain } from 'react-icons/md/'
import { TiWeatherSnow } from 'react-icons/ti/'
import { FaCalendar } from 'react-icons/fa/'
import '../stylesheets/ui.scss'



const percentToDecimal = (decimal) => {
    return((decimal * 100) + '%')
}

const calcGoalProgress = (total, goal) => {
    return percentToDecimal(total/goal)
}




export const SkiDayCount = ({total, powder, backcountry, goal}) =>  (
    <div className="ski-day-count">
        <div className="total-days">
            <span>{total}</span>
            <FaCalendar />
            <span>days</span>
        </div>
        <div className="powder-days">
            <span>{powder}</span>
            <TiWeatherSnow />
            <span>days</span>
        </div>
        <div className="backcountry-days">
            <span>{backcountry}</span>
            <MdTerrain />
            <span>days</span>
        </div>
        <div>
            <span>{calcGoalProgress(total, goal)}</span>
        </div>
    </div>
)


SkiDayCount.defaultProps = {
    total:'sdf',
    powder:10,
    backcountry:15,
    goal:75
}

SkiDayCount.propTypes = {
    total: PropTypes.number.isRequired,
    powder: PropTypes.number,
    backcountry: PropTypes.number
}
reactjs react-proptypes
1个回答
0
投票

你有没有检查你是否处于开发模式。出于性能原因,propTypes只在开发模式中检查.Check here

© www.soinside.com 2019 - 2024. All rights reserved.