我有以下创建文本区域的代码。
interface IReceiverProps {
receivedMessage: string;
topic: string;
}
export default class Receiver extends React.Component<IReceiverProps, {}> {
render() {
var textAreaStyle = {
width: 1300,
height: 450,
border: '3px solid #cccccc',
padding: '5px',
fontFamily: 'Tahoma, sans-serif',
overflow: 'auto',
marginLeft: '10px'
}
return (
<textarea style={textAreaStyle} value={this.props.receivedMessage}/>
);
}
}
此接收到的消息由另一个组件传递。如何在此文本区域中将 receivedMessage 一个一个地附加到另一个下方?任何帮助将不胜感激。
最佳答案
使用名为 textMessage 的状态。
constructor(props) {
super(props);
this.state = {
textMessage: props.receivedMessage
};
}
在 componentWillReceiveProps 中,附加到 textMessage。
componentWillReceiveProps(nextProps) {
if (nextProps.receivedMessage !== this.props.receivedMessage) {
this.setState({
textMessage: `${this.state.textMessage}\n{nextProps.receivedMessage}`
});
}
}
绑定(bind)到 textMessage。
<textarea style={textAreaStyle} value={this.state.textMessage} />
关于javascript - 如何将文本附加到在 React JS 中创建的文本区域?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39716848/