react-props 相关问题

ReactJS是由facebook开发的JS库。道具是反应组件中使用的变量。在对反应道具的使用有疑问时使用标签。

React 组件正在修改自己的 props,而不直接更改它们

我创建了一个 React 组件,它创建了一个包含 n 个输入的表单和一个自定义的 SubmitButton。我正在从父组件传递数据(一个数组属性)作为需要显示的初始值...

回答 1 投票 0

尝试为自定义组件设置 Key 时出错

将 React 与 Typescript 结合使用我试图做一件简单的事情,即迭代对象集合并基于每个对象 - 创建自定义组件的实例。 鉴于我是我们...

回答 1 投票 0

Playwright 测试失败:道具在 Playwright 测试 UI 和 Chrome 浏览器上的实际 React 应用程序中返回不同的值

我正在使用 Playwright(版本 1.44.1)为我的应用程序创建 e2e 测试。我有一个用于博客应用程序的 React 18 应用程序(使用 Vite 创建)。当我运行应用程序时,UI 显示正确...

回答 1 投票 0

如何在react js中使用context api

从“react”导入 React, { useEffect, useState }; 从“axios”导入 axios; 导出 const Context = React.createContext(); const Jokefetch = () => { const [笑话,setjok...

回答 1 投票 0

如何在React中使用不同的默认props?

我有一个react组件,它从它的props接收一个id。 导出类型 MyComponentProps = { id: 字符串 } 导出 const MyComponent = 函数(props: MyComponentProps) { 返回 ( { 我有一个 React 组件,它从它的 props 接收一个 id。 export type MyComponentProps = { id: string } export const MyComponent = function(props: MyComponentProps) { return ( <div>{props.id}</div> ); } 现在,我想让 id 可选,但我确实需要使用标识符,所以我将 id 设为可选并添加默认属性。 import { v4 } from 'uuid'; export type MyComponentProps = { id?: string } export const MyComponent = function(props: MyComponentProps) { return ( <div>{props.id}</div> ); } MyComponent.defaultProps = { id: `MyComponent-${v4()}` } 完成!但现在,如果我渲染 2 个不同的 MyComponent 实例,它们将具有相同的 id。我该如何解决这个问题?我所做的如下,但我不是反应专家,我不知道是否还有其他方法可以完成此任务。 import { v4 } from 'uuid'; export type MyComponentProps = { id?: string } export const MyComponent = function(props: MyComponentProps) { const id = props.id?? `MyComponent-${v4()}`; return ( <div>{id}</div> ); } 如果您希望每个组件的 ID 在渲染之间保持不变,则需要将其置于状态中。 export const MyComponent = function(props: MyComponentProps) { const [defaultId] = useState(v4) const id = props.id ?? defaultId return ( <div>{id}</div> ); } 从技术上讲,可以通过实现 HOC 来使用柯里化来缓存值。 基本实现如下所示: import { useRef } from "react"; import { v4 as uuidv4 } from "uuid"; const withId = (Component: React.FC) => ({ children, ...props }) => { const id = useRef(uuidv4).current; return <Component {...props} id={id} />; } const ComponentWithId = withId(Component); /* Usage */ interface WithId { id: string; } interface Props extends WithId {} const Component = ({ id }: Props) => { return <div id={id}>Some content</div>; }

回答 2 投票 0

道具不传递道具

我刚刚开始使用 React,我有这个 ItemMenu,假设将道具传递到侧边栏,但它不起作用。 我有 console.log 它,并且 ItemMenu 中的道具似乎正在工作......

回答 1 投票 0

传递道具不传递道具

我刚刚开始使用 React,我有这个 ItemMenu,假设将道具传递到侧边栏,但它不起作用。 我有 console.log 它,并且 ItemMenu 中的道具似乎正在工作......

回答 1 投票 0

自定义 MUI 字段 (<TextField />) 无法识别值的更改

我正在尝试创建自定义表单组件,因此如果我决定更改样式,则不需要更新每个项目。ReportSelect 版本不会在选择菜单项时更新值,并且...

回答 1 投票 0

React 传递对象与 props 中的多个变量

我希望将一个包含大量变量的对象从父级传递给子级。 例如,我想将 Person 传递给孩子 人:名字,姓氏,出生日期,国籍,电话,地址(n...

回答 1 投票 0

带有“responsive”属性的React-Bootstrap Table在Vite项目中没有滚动功能

我遇到一个问题,当屏幕尺寸在 x 方向上小于它时,我的 React-Bootstrap 表会溢出视口。我已经使用响应式pr将其制作成响应式表格...

回答 1 投票 0

带有 Chakra UI 的 TypeScript 支持 StyleProps 的正确方法是什么?

在父组件上收到错误消息: 输入 '{ 栏:字符串; py:字符串; }' 不可分配给类型“IntrinsicAttributes & Props”。 类型“

回答 1 投票 0

React Typescript:如何将 FunctionComponent 作为 Prop 传递给另一个 FunctionComponent

我正在尝试创建一个名为“BasicBlocks”的可重用 FunctionComponent,它具有标题、副标题和内容(这是一个 FunctionComponent)。此内容正在传递到 BasicBloc...

回答 1 投票 0

React 中 props 的 useState 未定义

我的用户数据包括一个ID、用户名和一个密码。 我正在尝试将我拥有的数据作为对象数组发送。它使用 .map 注释一一发送,但我想将其作为整个数组发送。这是吗

回答 1 投票 0

React - 道具 - 数据未显示

为什么数据没有显示?[[image1](https://i.sstatic.net/8sUjkMTK.png) 图片2 帮帮我,我被卡住了image3 尝试了这么长时间找不到错误,请验证错误并让我知道

回答 1 投票 0

React Eslint,如果组件 props Type 需要 prop,但组件不使用它,则会发出警告

考虑下面的组件,当组件在需要时不使用用户时,如何让 Eslint 发出警告? 类型 ItemCardProps = { 用户:数组; 编辑启用:布尔值; }; 导出常量 ItemFiel...

回答 1 投票 0

从渲染 prop 元素的子元素返回回调

地狱。我对渲染道具模式有一些疑问。 组件“ColumnAction”处理表头宽度调整,并通过捕获 mouseDown 和 mouseUp 等事件来重新排序每个表头......

回答 1 投票 0

React:获取父组件中子组件值的总和

父组件可以访问子组件的值,但无法对每个子组件的值求和。总数显示 0,而不是正确的总数。 我期待正确的总数...

回答 2 投票 0

这个在 onMount 指令中包含订阅者的 props 传递方法是如何工作的?

我正在尝试在 Svelte 中使用 Monaco 编辑器。我在网上找到了这个片段,它有一种有趣的定义组件的方式。看起来它在 onMount 阶段声明了这个内容对象...

回答 1 投票 0

如何使用选项卡导航器将道具传递到 Screen 组件?

这是我在 StackOverflow 上的第一篇文章,如果我没有遵循正确的格式,请道歉。 我正在使用 React Navigation v 5.x 中的选项卡导航器构建我的第一个应用程序,但遇到了一个大问题

回答 12 投票 0

如何在react中正确地跨组件传递props?

我试图让 leva 调试器为我的多维数据集提供缩放属性,但是当我传递缩放属性时,多维数据集就消失了,没有错误。我已经通过聊天 GPT 运行了它,但运气不佳,似乎无法运行

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.