如何使用reactjs获取整个数据块？
我创建了一个只显示block[0]值的组件，它不显示整个块值。
例如，如果我写：
HI
Stackoverflow
它只显示"Hi"，不显示该字段的全部内容。
任何人都可以帮助我获取我在该输入字段中写入的全部数据吗？
import React from "react";
import { Editor } from "react-draft-wysiwyg";
import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";
export default class Edit extends React.Component {
constructor(props) {
super(props);
this.state = {};
}
render() {
return (
<div>
<Editor value={this.props.value} onChange={this.props.onChange} />
</div>
);
}
}
应用组件：
import React from "react";
import Body from "./Body";
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
body: ""
};
}
changeBodyHandler = value => {
console.log(value.blocks[0].text);
this.setState({
body: value.blocks[0].text
});
};
render() {
return (
<div>
<Body
label="Body"
name="body"
value={this.state.body}
onChange={this.changeBodyHandler}
/>
</div>
);
}
}
export default App;
这是整个代码：
“ https://codesandbox.io/s/compassionate-tereshkova-89fm2 ”
qq_花开花谢_02回答
-
萧十郎
然后列出map()的每一行都可以join()\nthis.setState({ body: value.blocks.map(x => x.text).join("\n") });import React from "react";import Body from "./Body";class App extends React.Component { constructor(props) { super(props); this.state = { body: "" }; } changeBodyHandler = value => { this.setState({ body: value.blocks.map(x => x.text).join("\n") }); }; render() { console.log(this.state.body); return ( <div> <Body label="Body" name="body" value={this.state.body} onChange={this.changeBodyHandler} /> </div> ); }}export default App; -
慕工程0101907
如果您想像在编辑器中那样使用换行符，请在连接时添加<p>标签。 changeBodyHandler = value => { let data =value.block; let text = ""; data.map(index => { text = text +"<p>" +index.text+"</p>"; }); this.setState({ body: text }); };如果您想以相同的方式显示数据，请使用dangerouslySetInnerHTML <div dangerouslySetInnerHTML={{__html: this.state.body}} />
随时随地看视频慕课网APP
相关分类
JavaScript