Question

我是React的新手，我必须显示从数据库加载的一些书籍的数据，就像我在render（）中所做的那样。当我点击“所有图书”按钮时，我想这样做。我应该在getAllBooks函数中写什么来代替在render（）中编写代码？我真的找不到合适的方法去做。谢谢！，

import React, {Component} from 'react'
import BookStore from './BookStore'
import {EventEmitter} from 'fbemitter'

const emitter= new EventEmitter()
const store= new BookStore(emitter)

class BookList extends Component{
    constructor(props){
        super(props)
        this.state= {
            books: []
        }
    }
    componentDidMount(){
        store.getAll()
        emitter.addListener('BOOK LOAD', ()=>{
            this.setState({books: store.content})
        })

        this.getAllBooks = this.getAllBooks.bind(this);
    }

    getAllBooks(){

    }

    render(){
        return (
            <div>
            <div>
            <h3>The Books:</h3>
            <br></br>
            <div>
            {
            this.state.books.map((b)=>
            <div>{b.title +' by '+ b.author}</div>
            )
            }
            </div>
            </div>
            <input type="button" value="All Books" onClick={this.getAllBooks}/>

            </div>
        )
    }
}

export default BookList

Answer 1

您只需将渲染函数中的代码移至getAllBooks，但您也应将绑定移至constructor。

按钮上的显示元素单击React

1 个答案: