在React App中获取更新的数据时出现问题

时间:2020-09-04 17:16:09

标签: reactjs

我正在这里fetch('http://127.0.0.1:8000/api/'+book_id+'/'+msg+'/addchat/').then(response => response.json()).then(result => console.log(result)).catch(err => console.log(err))上更新数据库中的数据,并且在下一步中,我正在获取更新的数据,但是问题是它没有获取最新的更新数据。 例如 我发送了“ Hello”,它已经发送但没有在聊天显示中获取,下一个文本我发送了“ World”,然后文本“ hello”出现在我的聊天显示中,但没有出现在“ world”中。

const Yourbooks = () => {
    const send = (book_id,msg) => {
        fetch('http://127.0.0.1:8000/api/'+book_id+'/'+msg+'/addchat/').then(response => response.json()).then(result => console.log(result)).catch(err => console.log(err))
        fetch('http://127.0.0.1:8000/api/user_booklist/')
        .then(data => data.json())
        .then(data => {
            setBook({ books: data })
    })
    }
    const [book,setBook] =useContext(BookContext)
    return(
    book.books.map(book => 
        <div className='your_books' key={book.bookdetails.book_id}>
        <div className='bookcont'>
            <div className='bookimg'>
                <img src={book.bookdetails.book_img} className='boimg'></img>
            </div>
            <div className='bookdet'>
                <span className='bookname'>{book.bookdetails.book_name}</span>
                <span className='book_added_data'>{book.bookdetails.time}</span>
            </div>
            <button className='delete'>Delete</button>
        </div>
        <div className='comment'>
            <div className='chat_container' id={book.bookdetails.book_id+'_container'}>
                <div className='chat_msg'>
                {/* {console.log(book.status.chats)} */}
                <Chats chat={book.status.chats}></Chats>
                </div>
            
            <div className='text_send'><input type='text' className='msg' id={book.bookdetails.book_id}></input>
            <input type='button' className='sendbutton' value='send' onClick={() => send(book.bookdetails.book_id,document.getElementById(book.bookdetails.book_id).value)}></input>
            </div></div>
            <button
             className='show_hide_char' onClick={(e)=>{
                document.getElementById(book.bookdetails.book_id+'_container').style.height=document.getElementById(book.bookdetails.book_id+'_container').style.height!='auto'? 'auto':'0px';
                e.target.innerHTML=e.target.innerHTML=='Show Comment'? 'Hide Comment':'Show Comment' 
            }}>Show Comment</button>
        </div>
    </div>
    ))

        }      
export default Yourbooks;

有人可以帮助我解决这个问题吗?

0 个答案:

没有答案