Question

我正在尝试编写一个类似控制台的组件，在该组件中，它会在另一条消息之后打印一条消息，而不是替换旧消息。

理想情况下，我想要做的是拥有一个组件，可以使用程序的其他部分将字符串打印到聊天框中，并且该组件将继续向下滚动新输出的字符串，您可以向上滚动以查看旧弦。永远或者一旦达到x行数，就会删除最旧的行。

git merge --no-ff

我将如何做这样的事情？有没有能让我做这样的事情的组件？我想到只是将新字符串以我的状态继续添加到旧字符串中，然后只显示状态，但这听起来会占用很多不必要的空间和资源。

这是我尝试过的方法，但是所有这些都太慢了，如果滚动太快，我最终会在一行上收到多条消息：

我想要的只是在页面上打印这些事件消息的一种简便方法，最好是在某种聊天框（如组件）中，并且不像更新状态那样慢，我假设有一种方法可以打印它而不是必须在仍将其保留在屏幕上的同时将其保持在我的状态？

我知道我的措辞很差，但是我对术语不熟悉。

Answer 1

至少您需要将所有这些值存储到数组中并在渲染器中显示所有值

class App extends Component {
  constructor() {
    super();

    this.state = {
      mainStr: []
    };
    this.eventHandler.bind = this.eventHandler.bind(this);
  }

  eventHandler = (e) => {

    let newValue = e.type.toString(); // your new value

    this.setState({
      mainStr: [...this.state.mainStr, newValue)]
    })
  };

  render() {
      return ( <
        div onWheel = {
          this.eventHandler
        } >
        PERFORM EVENTS HERE {
          this.state.mainStr.map(str => < p > str < /p>)} <
            /div>
          );
        }
      }

将消息打印到组件中

1 个答案: