前端实现模糊查询

import React, { Component } from 'react'
import axios from 'axios'
export default class Cinema extends Component {
    constructor() {
        super()
        this.state = {
            cinemalist: [],//数据集合
            bCinemalist:[]//数据集合
        }
    render() {
        return (
            <div>
                <input type="text" onInput={this.handleInput} />
                <ul>
                    {
                        this.state.cinemalist.map((item) =>
                            <li key='item.cinameId'>
                                <div>{item.name}</div>
                                <div>{item.address}</div>
                            </li>
                        )
                    }
                </ul>
            </div>
        )
    }
    handleInput = (event) => {
        var newList = this.state.bCinemalist.filter(item => item.name.toUpperCase().includes(event.target.value.toUpperCase()) || item.address.toUpperCase().includes(event.target.value.toUpperCase()))
        this.setState({ cinemalist: newList })
    }
}

//includes() 方法用于判断字符串是否包含指定的子字符串。

如果找到匹配的字符串则返回 true，否则返回 false。

//toUpperCase() 方法用于把字符串转换为大写。