index.jsx 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import React, { Component } from "react";
  2. import style from "./index.less";
  3. import config from '@config/index';
  4. class Textarea extends Component {
  5. constructor(props) {
  6. super(props);
  7. this.state = {
  8. timer:null
  9. };
  10. this.$dom = React.createRef();
  11. this.handleInput = this.handleInput.bind(this);
  12. }
  13. handleInput(e){
  14. const {handleChangeAssistValue,idx,handlePush} = this.props;
  15. const text = e.target.innerText;
  16. const stimer = this.state.timer;
  17. handleChangeAssistValue&&handleChangeAssistValue(text,idx);
  18. //右侧推送--延时推送
  19. clearTimeout(stimer);
  20. let timer = setTimeout(function(){
  21. handlePush&&handlePush();
  22. clearTimeout(stimer);
  23. },config.delayPushTime);
  24. this.setState({
  25. timer
  26. });
  27. }
  28. shouldComponentUpdate(next){
  29. if(JSON.stringify(next) == JSON.stringify(this.props)){
  30. return false;
  31. }
  32. return true;
  33. }
  34. componentWillReceiveProps(next){
  35. const isRead = this.props.isRead;
  36. if(next.isRead != isRead){
  37. this.$dom.current.innerText = next.value||'';
  38. }
  39. }
  40. componentDidMount(){
  41. const {value} = this.props;
  42. if(value){
  43. this.$dom.current.innerText = value||'';
  44. }
  45. }
  46. render() {
  47. const {value} = this.props;
  48. return (
  49. <div className={style.divTextarea}
  50. contenteditable={true}
  51. ref={this.$dom}
  52. onInput={this.handleInput}
  53. onPropertyChange={this.handleInput}
  54. ></div>
  55. );
  56. }
  57. }
  58. export default Textarea;