Why doesn't Router?

It is the main component

import React from "react";
from PageOne import "./pageone";
import from PageTwo "./pagetwo";
import PageTree from "./pagetree";
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
import RouterDom from "react-router-dom";



class App extends React.Component {
constructor(props){
super(props);
}


 render() { 
 return (
<router>
 <route path="/pageone" component="{PageOne}"></route>
 <route path="/pagetwo" component="{PageTwo}"></route>
 <route path="/pagetree" component="{PageTree}"></route>
</router>


)



}

}
export default App;

Now comes the component PageOne

import React from "react";
import from PageTwo "./pagetwo";
import PageTree from "./pagetree";
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
import RouterDom from "react-router-dom";


class PageOne extends React.Component {
constructor(props){
super(props);

}


 render() {
return(
the <div>
<p>Hello</p>
</div>
)

}

}
export default PageOne;

Please tell me why it does not display the word Hello when I turn on the address bar the link