react-props 相关问题

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

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

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

javascript reactjs typescript react-props

回答 1 投票 0

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

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

reactjs react-props e2e-testing playwright-test

回答 1 投票 0

如何在react js中使用context api

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

javascript reactjs react-hooks react-props react-context

回答 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>; }

javascript reactjs typescript react-props

回答 2 投票 0

道具不传递道具

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

reactjs parameter-passing react-props

回答 1 投票 0

传递道具不传递道具

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

reactjs parameter-passing react-props

回答 1 投票 0

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

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