自动完成形式错误:未指定的TypeError: data.match不是一个函数

Question

我正在使用React，并试图找出如何从JSON返回自动完成形式的数据

这是数据

const falsyData = [{
    'Hello': {
      'what I do'       : 'you just say Hello',
      'which language'  : 'english'
    },
    'Travel': {
      'Etymology' : 'The origin of the word "travel" is...',
      'Purpose'   : 'include recreation'
    },
    'Gambling': {
      'Gamble'  : 'Gambling is the wagering of money...',
      'Origins' : 'Many popular games played in...'
    }
  }];

  render () {
    return (
      <Grid>
            <TextField
                onChange={this._onChange.bind(this)}
                onKeyUp={this._changeInput.bind(this)}
                value={this.state.value} />
            {!!this.state.value.length &&
              <Row>
                <Column>  
                 //HERE I PRINT THE RESULTS OF THE SEARCH
                  <p>{this.state.result}</p>
                </Column>                              
              </Row>
            }
      </Grid>
    );
  }

  _matchData = (input) => {
    let reg = new RegExp(input.split('').join('\\w*').replace(/\W/, ""), 'i');
    return falsyData.map(function(data) {
      if (data.match(reg)) {
        return data;
      }
    });
  }

  _changeInput = (val) => {
    let autoCompleteResult = this._matchData(this.state.value);
    if (autoCompleteResult.length) {
      this.setState({result: autoCompleteResult.join(' ')});
    };
  }

  _onChange = (event) => {
    this.setState({value: event.target.value});
  } 

我需要过滤数据，比方说用户在A中输入，所以在<p>{this.state.result}</p>中，我想看到带有字母A的所有内容。

更具体的情况是:如果用户输入hello，我希望看到hello中的falsyData及其属性和属性。

BTW

每次我输入搜索栏，这就是我在浏览器控制台中得到的内容。

Uncaught : data.match不是函数

Answer 1

falsyData是一个对象数组。在这段代码中：

return falsyData.map(function(data) {
  if (data.match(reg)) {
    return data;
  }
});

您正在对对象进行映射，因此data没有match函数，因为它不是字符串。

根据要匹配的内容，将其更改为匹配对象中的字符串值。例如，如果您只想匹配外部对象的键：

return falsyData.map(function(data) {
  for (var key in data) {
    if (key.match(reg)) {
      return key;
    }
  }
});