我正在使用reactjs开发一个网站。我只想在其中一个页面上添加一个文本区域。每个页面都有一个标题和一个内容标签。如果我将代码放在app.js中，它将显示在每个页面上：
import react from 'react';
import Header from './Header.js';
class App extends react.Component {
render() {
return (
<div>
<Header />
<Content />
</div>
);
}
}
class Content extends react.Component {
render() {
return (
<div>
<h1 className='center bold'>Hi</h1>
<textarea id='editor' rows="25" cols="90"></textarea>
</div>
);
}
}
export default App;然后我有一个网页javascript，code.js：
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById('root')
);然后是html标记code.html：
创造
<body>
<header></header>
<content></content>
<div>
<textarea id='editor' rows="25" cols="90">
</textarea>
</div>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="app"></div>
</body>我曾尝试将textarea放在许多不同的地方，但都没有成功。它要么不呈现，要么在任何页面上呈现。
我如何才能让它只出现在我想要的页面上？
1条答案
按热度按时间h79rfbju1#
请在app.js中获取一个状态值，如-this.state={currentpage:“<page no 1>”}，然后在app.js中编写一个函数来更改此状态值。pagechangehandler=（值）={this.setstate（{currentpage:val}）}。现在将this.state.currentpage和this.pagechangehandler作为道具传递给5个页面中的每一个。。在要放置文本区域的页面内，使用props中的currentpage进行检查。在页面更改时，请调用函数this.props.pagechangehandler（）并传递当前页面。我希望这能解决你的问题！请让我知道！