Question

任务

构建一个为我们的聊天应用程序提供内容过滤的服务。该服务应该监听传入消息的firebase引用子“/ messages”。对于写入此子项的每条消息，您需要过滤消息并用firebase DB中“/ words”引用子项中的“*”替换单词。

第1部分 - 列出屏幕上/消息的所有消息。

第2部分 - 列出屏幕上所有单词/ words。

第3部分 - 编写一个算法，将/ words列表中的单词更改为****，如果它们出现在/ messages中的任何消息中。

＆＃13;

import React, { Component } from 'react';
import * as firebase from 'firebase';
import './App.css';

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      messages: [],
      words: [],
      filterMessages: [],
    };
    console.log(this.state.messages, this.state.words);
  }

  componentWillMount() {
    const messages = firebase.database().ref().child('/messages');
    const words = firebase.database().ref().child('/words');
    console.log(messages, words);
    const messagesArray = [];
    const wordsArray = [];
    messages.on('child_added', snap => {
      messagesArray.push(snap.val());
      this.setState({
        messages: messagesArray,
      });
    });
    words.on('child_added', snap => {
      wordsArray.push(snap.val());
      this.setState({
        words: wordsArray,
      });
    });
  }

  filterByWords = () => {

  };

  filterData = (data) => data.filter(this.filterByWords);

  renderListItem = (data) => data.map((item, index) => {
    return (
      <li key={index}>{item}</li>
    )
  });


  render() {
    return (
      <div className="App">
        {console.log('render', this.state)}
        <ul className="defaultList">
          {this.renderListItem(this.state.messages)}
        </ul>
        <button
          className="filterBtn"
          onClick={() => this.filterData(this.state.messages)}
        >
          filter
        </button>
        <ul className="filterList">
          {this.renderListItem(this.state.filterMessages)}
        </ul>
      </div>
    );
  }
}

export default App;

＆＃13;

Answer 1

    const messageWords = message.split(" ");
    const newWords = words.map(word => messageWords.includes(word) ? "*".repeat(word.length) : word);

这可能是什么工作的一般概念 - 取决于你的数据是什么样的。

基本上，对于每条消息，您需要将该消息拆分为单词，以便您可以将/单词与单个消息单词进行比较。然后，只需使用Array.prototype.includes查找消息是否包含单词即可。如果有匹配则返回＆＃34; *＆＃34;乘以单词的长度，否则只返回单词;

如何用另一个单词数组过滤数组中的句子？

1 个答案: