reactjs - Phần tử ràng buộc 'title' ngầm định có kiểu 'any'. - lỗi

Tôi đang gặp phải vấn đề sau:

LỖI trong src/components/Header.tsx:6:18

{tiêu đề}

TS7031: Phần tử ràng buộc 'title' ngầm định có kiểu 'any'. 4 | 5 | 6 | const Header=({title}) => { | ^^^^^7 | return( 8 | 9 |

App.tsx chứa:

import Header from './components/Header'

const App = () => {
return (
     <div className='container'>
       <Header title='Hello' />
     </div>
   )
 }
 
 export default App;

Header.tsx chứa mã sau:

import PropTypes from 'prop-types'
import Button from './Button'



const Header = ({title}) => {
    return(
        <header className='header'>
            <h1>{title}</h1>
            <Button color='green' text='Add'/>
            
        </header>
    )
}

Header.defaultProps = {
    title: 'TaskTracker',
}

Header.propTypes = {
    title: PropTypes.string.isRequired,
}

export default Header

Khai báo các biến.

Câu trả lời #1

import Header from './components/Header'

const App = () => {
return (
     <div className='container'>
       <Header title='Hello' />
     </div>
   )
 }
 
 export default App;

Bạn nên sử dụng các kiểu để gõ với TypeScript thay vì PropTypes.

import Button from './Button'



const Header = ({title} : {title: string}) => {
    return(
        <header className='header'>
            <h1>{title}</h1>
            <Button color='green' text='Add'/>
            
        </header>
    )
}

export default Header

Tín dụng: @Konrad