react-hooks 相关问题

我有一些关于 React 代码的问题。在我的 App.jsx 中，我编写了包含或不包含从 jsx 标签获得的对象的解构逻辑：我有一些关于 React 代码的问题。在我的 App.jsx 中，我编写了从 jsx 标签获得的对象的解构和不解构逻辑： <input name="fName" placeholder="First Name" onChange={handleChange} value={fullName.fName} /> <input name="lName" placeholder="Last Name" onChange={handleChange} value={fullName.lName} /> 这是解构方式的代码： function handleChange(event) { const { name, value } = event.target; setFullName((preValue) => { if (name === "fName") { return { fName: value, lName: preValue.lName, }; } else if (name === "lName") { return { fName: preValue.fName, lName: value, }; } }); } 虽然这是没有解构方式的代码 function handleChange(event) { setFullName((preValue) => { if (event.target.name === "fName") { return { fName: event.target.value, lName: preValue.lName, }; } else if (event.target.name === "lName") { return { fName: preValue.fName, lName: event.target.value, }; } }); } 请注意，我尝试用相同的逻辑编写代码。然而，虽然前者确实有效，但在后一种方式中，我的代码不起作用并开始崩溃并显示此错误： TypeError Cannot read properties of null (reading 'name') eval /src/components/App.jsx:11:23 8 | 9 | function handleChange(event) { 10 | setFullName((preValue) => { > 11 | if (event.target.name === "fName") { | ^ 12 | return { 13 | fName: event.target.value, 14 | lName: preValue.lName, 我希望即使我不使用解构它也能工作在第一个片段中，值 name 和 value 在调用 setFullName 之前被复制。在第二个示例中，访问对象 event。如果对象被修改，您会得到不同的行为。示例： const event = { target: 1 } function f1(event) { const {target} = event; g1(() => { console.log(target); }); } function f2(event) { g2(() => { console.log(event.target); }); } function g1(f) { setTimeout(f, 10); } function g2(f) { setTimeout(f, 10); } f1(event); f2(event); event.target = 10;

javascript reactjs react-native react-hooks

回答 1 投票 0

动态更新每个按钮上单击组件的 URL - ReactJS

我基本上是一个新手，无法做出反应。我目前正在使用 ReactJS 构建一个应用程序。所以，这是我的问题。我有这个模态和主页组件。每当我单击映射自...的卡片组件时

reactjs react-hooks react-router react-router-dom

回答 1 投票 0

如何在React中维护页面刷新时的音频自动播放功能？

问题：我正在开发一个 React 应用程序，当计时器超过特定限制时，我需要播放通知声音。每次满足条件时，即使在一页之后，也应该播放声音

reactjs audio react-hooks notifications autoplay

回答 1 投票 0

滚动到顶部，路线更改不起作用

我正在开发一个 React 项目，在导航到新路线时我需要页面滚动到顶部。我已经实现了 ScrollToTop 组件，但它似乎不起作用。该页面保留...

javascript reactjs react-hooks react-router react-router-dom

回答 1 投票 0

在函数内部响应自定义钩子调用

const fun = () => { const result = useCustomHook() console.log(result) } 我嵌套了自定义钩子 const useCustomHook = () => { const res = useNestCustomHook() console.log(res) } 有没有...

reactjs react-hooks

回答 1 投票 0

如何在React组件中根据源文件应用不同的逻辑？

我正在开发一个 React 应用程序，并且有一个场景，我需要根据调用我的组件的文件应用不同的逻辑。这是设置：你好世界.js： if (parsedData.extras?.leng...

reactjs react-hooks react-router

回答 1 投票 0

为什么useState在这种情况下不起作用

我正在学习前端开发，被这个看似很简单的问题卡住了，但我不明白为什么它不起作用。当我点击“添加到购物车”按钮时，我想要

reactjs typescript react-hooks

回答 1 投票 0

在内部放置一个钩子并从那里调用它是否有效？

VSCode 不会将其标记为无效，尽管钩子是有条件运行的：函数 useHook() { 返回1； } 函数 useHook2() { const 二 = useMemo(() => 2, []); 返回两个； }