index.jsx 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  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. onChange={this.handleInput}
  53. ></div>
  54. );
  55. }
  56. }
  57. export default Textarea;