为什么反应原生道具不起作用？

Question

您能帮我解决以下问题吗：

props.title 没有出现在 {props.title} 中

console.log(props.title); //返回Mobile App，那么console中有几行未定义？

console output

我正在使用 react native+typescript。

import React  from 'react';
import ReactDOM from 'react-dom';

const MobileApp = (props : any)  => {
    console.log(props.title);
    return (
        <div >
        <div>Test</div>
        <div>{props.title}</div>
        </div >
    );
  
}

ReactDOM.render(
    <MobileApp title="Mobile App"/>,
  document.getElementById('root')
);

export default MobileApp;

Answer 1

Finally found solution. Code was divided in 2 files. App.tsx:
-------------------------------------------------------------
import MobileApp from './MobileApp';
import React from 'react';
import ReactDOM from 'react-dom';

const App = () => {
  return ReactDOM.render(
    <MobileApp title="Mobile App"/>,
    document.getElementById('root')
  );
}

export default App;
-------------------------------------------------------------
and MobileApp.tsx:
-------------------------------------------------------------
export interface MobileApp {
  title: string;
}

const MobileApp = (props: MobileApp)  => {
    console.log(props.title);
    return ( 
        <div >
        <div>{props.title}</div>
        <Form />
        </div >
    );
}

class Form extends React.Component {
    state = { userName: '', password: '' };
    handleSubmit = (event : any) => {
    event.preventDefault();
    console.log(this.state.userName + ' ' + this.state.password );
  };
    render() {
    return (
        <form onSubmit={this.handleSubmit}>
            <input 
            type="text" 
            value={this.state.userName} 
            onChange={event => this.setState({ userName: event.target.value })}
            placeholder="Username"/><br/>
            <input 
            type="text" 
            value={this.state.password} 
            onChange={event => this.setState({ password: event.target.value })}
            placeholder="Password"/><br/>
        <button>Login</button>
        </form>
    );
  }
}

export default MobileApp;

Answer 2

这样使用

const MobileApp = props  => {

或

const MobileApp = ({props})  => {