Javascript 编译警告:对于已使用的变量,没有未使用的变量

Javascript 编译警告:对于已使用的变量,没有未使用的变量,javascript,reactjs,Javascript,Reactjs,因此我有一个React组件,SearchBooks,它从主App.js状态接收一个数组books,还有一个函数,onupdatebookstate,也从App.js接收 一切都很好,但我收到警告说两个都没有被使用,但它们都被使用了 为什么我会收到这些警告?我如何纠正根本问题 SearchBooks.js import React, { Component } from 'react' import * as BooksAPI from './utils/BooksAPI' import Book

因此我有一个React组件,
SearchBooks
,它从主
App.js
状态接收一个数组
books
,还有一个函数,
onupdatebookstate
,也从
App.js
接收

一切都很好,但我收到警告说两个都没有被使用,但它们都被使用了

为什么我会收到这些警告?我如何纠正根本问题

SearchBooks.js

import React, { Component } from 'react'
import * as BooksAPI from './utils/BooksAPI'
import Book from './Book';

export default class SearchBooks extends Component {

    state = {
        query: '',
        results: []
    }

    updateQuery(query) {
        this.setState(() => ({
            results: [],
            query: query
        }))
        this.bookSearch(query)
    }

    bookSearch(e) {
      if (e.length > 0)
        BooksAPI.search(e)
        .then(searchResults => this.setState(currentState => ({
          results: this.updateExistingShelves(searchResults)
        })));
     }

     updateExistingShelves(searchResults) {
       if(searchResults.error !== "empty query") {
        const myBooks = this.props.books // books used here
        const addToState = searchResults.filter((result) => myBooks.find(b => {
          if(b.id === result.id)
            result.shelf = b.shelf
            return result
        }))
        myBooks.concat(addToState)
        return searchResults
       }
     }


    render() {

        const { query, results } = this.state
        const { onUpdateShelf, books, onUpdateBooksState } = this.props

        return(
            <div className="search-books">
                <div className="search-books-bar">
                  <a className="close-search" >Close</a>
                  <div className="search-books-input-wrapper">
                    <input
                        type="text"
                        placeholder="Search by title, author or subject"
                        value={query}
                        onChange={(event) => this.updateQuery(event.target.value)}
                    />
                  </div>
                </div>
                <div className="search-books-results">
                  <ol className="books-grid">
                    <li>
                      { results ? (
                        results.map((book) => (
                          <Book
                            key={book.id}
                            book={book}
                            updateShelf={onUpdateShelf}  // onUpdateShelf used here
                             />
                          ))
                        ) : (
                          <h4>No results for, "{query}"</h4>
                        )}
                    </li>
                  </ol>
                </div>
            </div>
        )
    }
}

这是一个EsLint警告,用于防止您声明未使用的变量

在这一行中,您正在声明(不使用)变量

const { onUpdateShelf, books, onUpdateBooksState } = this.props
变量
books
onupdatebookstate
不在代码中的任何位置使用

把它们扔掉,把线路改成

const { onUpdateShelf } = this.props

这是一个EsLint警告,用于防止您声明未使用的变量

在这一行中,您正在声明(不使用)变量

const { onUpdateShelf, books, onUpdateBooksState } = this.props
变量
books
onupdatebookstate
不在代码中的任何位置使用

把它们扔掉,把线路改成

const { onUpdateShelf } = this.props