javascript - 哪个支架应该用在哪里?对象解构时的方括号或花括号?我很想使用上下文但有点困惑
问题描述
这是我的上下文,我想在我的 BookList 组件中使用它。
import React, { createContext, useState } from "react"
import { v4 as uuidv4 } from "uuid"
export const BookContext = createContext()
const BookContextProvider = (props) => {
const [books, setBooks] = useState([
{ title: "Deek Work", author: "Cal Newport", id: 0 },
{ title: "Principles", author: "Ray Dalio", id: 1 },
{ title: "Sapiens", author: "Yuval Noah Harari", id: 2 },
{ title: "Grit", author: "Angela Duckworth", id: 3 },
{ title: "Ikagai", author: "Hector Garcia", id: 4 },
])
const addBook = (title, author) =>
setBooks([...books, { title, author, id: uuidv4() }])
const removeBook = (id) => setBooks(books.filter((book) => book.id !== id))
return (
<BookContext.Provider value={{ books, addBook, removeBook }}>
{props.children}
</BookContext.Provider>
)
}
export default BookContextProvider
BookList 组件:
import React, { useContext } from "react"
import { BookContext } from "../contexts/BookContext"
const BookList = () => {
const { books } = useContext(BookContext)
}
为什么 books 变量在花括号内而不是方括号内?即使状态即书籍是使用 useState 钩子创建的,也是一个数组。
解决方案
推荐阅读
- julia - .= Julia 中的运算符
- node.js - BodyPix - 在 node.js 中运行 toMask() 和 toColoredPartMask() 会引发错误:未定义 ImageData
- java - 使用 Ant 运行 JavaFX 8 应用程序时出现异常
- sql - Oracle shows "no data found" when I try to retrieve data from existing column
- python - 为什么 NumPy vsplits / hsplits 不遵循从 0 开始索引的通常编程约定?
- plsql - 三表之间的pl/sql全外连接
- php - 如何在 Laravel 中公开一个不在 public/ 中的特定目录?
- trigonometry - 从posenet坐标计算躯干偏航
- java - Android Studio 错误 - groovy.lang.MissingMethodException:没有方法签名:build_8sqj**q9.android() 适用于参数类型:***
- html - 渐变叠加图像