流量不

Question

看看這個類明白proptypes：

/* @flow */ 
import React, { PureComponent } from 'react'; 
import PropTypes from 'prop-types'; 
import { connect } from 'react-redux'; 

const mapStateToProps = (state) => ({ 
    email: ... 
}); 

@connect(mapStateToProps) 
class UserControlPanel extends PureComponent { 
    static propTypes = { 
     email: PropTypes.string 
    } 
    logout = (ev:any) => { 
     ev.preventDefault(); 

     ... 
    } 
    render() { 
     const { email } = this.props; 

     return (
      <div className="ucp"> 
       ... 
      </div> 
     ); 
    } 
} 

export default UserControlPanel; 

很簡單陣營，接受單個字符串支撐命名電子郵件組件類。但是當我運行流量時，它給了我這個錯誤：

[flow] property email (Property not found in props of React element UserControlPanel See also: React element UserControlPanel)

我是錯在哪裏？我也試過這樣：

type Props = { 
    email: string; 
}; 

@connect(mapStateToProps) 
class UserControlPanel extends PureComponent { 
    props:Props 
    static propTypes = { 
     email: PropTypes.string 
    } 

或者這樣：

type Props = { 
    email: string; 
}; 

@connect(mapStateToProps) 
class UserControlPanel extends PureComponent<Props> { 
    static propTypes = { 
     email: PropTypes.string 
    } 

雙方將沒有奏效。僅使用Component而不是PureComponent也無效。

如何讓流程理解我的道具類型並且不再出現錯誤信息？

Answer 1

如果您已經使用流類型驗證了您的類型，則不應該使用PropTypes。

相反，請嘗試以下操作：

/* @flow */ 
import * as React from 'react'; 
import { connect } from 'react-redux'; 

const mapStateToProps = state => ({ 
    email: ... 
}); 

type Props = { 
    email: string, 
}; 

@connect(mapStateToProps) 
export default class UserControlPanel extends React.PureComponent<Props> { 
    render() { 
     const { email } = this.props; 

     return (
      <div className="ucp"> 
       ... 
      </div> 
     ); 
    } 
}