2017-10-10 104 views
0

驗證除了Proptypes.func以外的無狀態組件的proptypes的最佳方式是什麼?驗證作爲道具傳遞的組件的最佳方法

比方說,我有一個NestedDashboardItem組件將作爲道具收到Icon組件。我不想把它作爲一個孩子使用,並且從props.children開始使用它,因爲我有一些使用情況,這會像傳遞一組嵌套的子鏈接等那樣矯枉過正。

考慮:

<DashboardItem 
    to="/route" 
    icon={someIconComponent} 
    text="sometext" 
    /> 

,並在DashboardItem定義我想驗證該圖標託

const DashboardItem = ({ text, icon, to, classes }) => { 
     const Icon = icon; 
     return (
     <ListItem 
      button 
      component={Link} 
      to={to} 
      activeClassName="active" 
      className={classes.root} 
     > 
      <ListItemIcon className={cx(classes.dashboardIcon_wrapper)}> 
      <Icon className={cx(classes.icon)} /> 
      </ListItemIcon> 
      <ListItemText primary={text} /> 
     </ListItem> 
    ); 
    }; 

我用PropTypes.element,它抱怨,所以現在我要問是什麼驗證icon支柱的最佳方法,而不是PropTypes.func

+0

你想要在'icon'屬性中驗證什麼? – juliobetta

+0

「我用PropTypes.element,它抱怨說」它說了什麼? – Aaronius

+0

@juliobetta我想驗證傳入的圖標組件本身,通常它是無狀態的,這實際上只是一個函數。理由是我可能會通過它其他類型的組件,並尋找的東西,而不僅僅是驗證功能 –

回答

0

沒有更好的辦法。使用PropTypes.func

+0

我有時不會傳遞一個無狀態的組件,我需要一些通用的東西 –

相關問題