标签[react-props] 最普遍问题

[英]forEach() in React JSX does not output any HTML

我有一个要通过 React 输出的对象：我的反应组件（减少）是另一个组件正如您从上面的代码段中看到的，我试图通过在 props 中使用数组 Answers 来插入组件 Answers 的数组，它确实会迭代但不会输出到 HTML 中。 ...

将 object 作为 props 传递给 jsx

[英]Passing object as props to jsx

我有一个 object 包含多个常见的键值道具，我想传递给一些 jsx。是这样的：我希望这个 function 作为传递个人道具：这可能吗？ ...

在 React JSX 中访问引号内的道具

[英]Access props inside quotes in React JSX

在 JSX 中，如何从引用的属性值中引用props中的值？例如： <img className="image" src="images/{this.props.image}" /> 生成的 HTML 输出为： <img class="image" src="images/{ ...

React - TypeError：无法读取未定义的属性“道具”

[英]React - TypeError: Cannot read property 'props' of undefined

我正在尝试创建一个能够删除我列表中的项目的点击事件，但是当我点击它时，我得到“类型错误：无法读取未定义的属性‘道具’”。我试图尽可能地坚持使用 ES6，而且我很确定它可以在某处绑定“this”，但是我尝试了很多地方都没有成功。 ...

功能无状态组件中的 PropTypes

[英]PropTypes in functional stateless component

在不使用类的情况下，如何在 react 的功能性无状态组件中使用 PropTypes？ ...

如何在功能组件的 React 中的 props 中使用 generics？

[英]How to use generics in props in React in a functional component?

在基于 class 的组件中，我可以轻松编写如下代码：实际上这个CollapsableDataList组件应该是一个功能组件，因为它是无状态的，但我不知道如何编写 function 组件并在道具中使用 generics，对我有什么建议吗？ ...

输入'元素| undefined' 不可分配给类型 'ReactElement <any, string | ((props: any)< div><div id="text_translate"><p> 我有一个看起来像这样的组件。这个版本完美运行：</p><pre> export default function StatusMessage(isAdded: boolean, errorMessage: string) { if (isAdded) { return <ResultAlert severity="success" text="User Added" />; } else { if (errorMessage.== '') { if ( errorMessage;includes('email') ) { return <ResultAlert severity="error" />. } if ( errorMessage;includes('phone number') ) { return ( <ResultAlert severity="error" text="" /> ); } } } }</pre><p> 现在，我正试图改变我导出它的方式。我正在尝试这个：</p><pre> type StatusMessageProps = { isAdded: boolean; errorMessage: string; } export const StatusMessage: React.FunctionComponent<StatusMessageProps> = ({ isAdded, errorMessage }) => {</pre><p> 但我不断收到错误消息：</p><pre> Type '({ isAdded, errorMessage }: PropsWithChildren<StatusMessageProps>) => Element | undefined' is not assignable to type 'FunctionComponent<StatusMessageProps>'. Type 'Element | undefined' is not assignable to type 'ReactElement<any, string | ((props: any) => ReactElement<any, string |... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)> | null'. Type 'undefined' is not assignable to type 'ReactElement<any, string | ((props: any) => ReactElement<any, string |... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)> | null'.</pre><pre> I am using the same method on different pages but the error is only here</pre><p> 编辑：</p><p> 我像这样使用这个组件：</p><pre> const [isAdded, setIsAdded] = useState(false); {isSubmitted && StatusMessage(isAdded, errorMessage)}</pre><p> 它在 isAdded 上给我一个错误</p><pre>Argument of type 'boolean' is not assignable to parameter of type 'PropsWithChildren<StatusMessageProps>'.ts(2345)</pre></div></any,>

[英]Type 'Element | undefined' is not assignable to type 'ReactElement<any, string | ((props: any)

我有一个看起来像这样的组件。这个版本完美运行：现在，我正试图改变我导出它的方式。我正在尝试这个：但我不断收到错误消息：编辑：我像这样使用这个组件：它在 isAdded 上给我一个错误 ...

在 typescript 中将 useState 作为道具传递

[英]Passing useState as props in typescript

假设我有一个包含两个子组件的父组件：现在我 go 如何在MyChildComponent2中正确设置类型？到目前为止，这是我想出的： setMyvar的类型是否正确？或者它应该是别的什么？ ...

如何使用选项卡导航器将道具传递给屏幕组件？

[英]How to pass props to Screen component with a tab navigator?

这是我在 StackOverflow 上的第一篇文章，如果我没有遵循正确的格式，请深表歉意。我正在使用tab navigator from React Navigation v 5.x器构建我的第一个应用程序，并且在将道具从一个屏幕传递到另一个屏幕时遇到了一个大问题我想要实现的是：在我的一个屏 ...

如何将功能作为道具从功能父组件传递给子组件

[英]How to pass function as props from functional parent component to child

父组件：子组件：在这里，我想将 Parent 的函数传递给子组件，以便子组件可以执行它来重置父组件中的状态 ...

使用 react-hook-form 进行表单模式验证

[英]Form pattern validation with react-hook-form

我一直在研究一个反应表单，我需要限制用户放置特殊字符并只允许这些字符：[A-Za-z]。我已经尝试了下面的代码，但我仍然可以在特殊字符中插入，例如：'♥'、'>'、'+'等。我将它作为道具发送到我的表单：你能让我知道我错过了什么并指出可能是什么问题吗？非常感谢。 ...

比较 componentDidUpdate 中的 PrevProps

[英]Comparing PrevProps in componentDidUpdate

我正在尝试检测已安装组件的componentDidUpdate内的道具何时发生变化。我有一个工作正常的测试（下面代码中的refreshData ）。是否可以通过componentDidUpdate(prevProps)未检测到的方式传递道具？在 component.js 中：并在 Ap ...

反应 propTypes 组件类？

[英]React propTypes component class?

如何验证提供的 prop 是组件类（不是实例）？例如 ...

如何获取 React Table Row Data Onclick

[英]How to get React Table Row Data Onclick

嗨，我正在尝试设置我的反应应用程序，以便当您单击反应表中行项目中的按钮时，该行中的数据将传递到另一个组件。目前我只是想在 console.log 中记录正确的数据，但不确定如何根据点击传递反应表行数据。我怎样才能做到这一点？谢谢我的虚拟数据与按钮（显示详细视图）一起存储在状态中，我想触发通过 ...

`componentWillMount` 警告可见，即使 'componentWillMount' 没有明确使用

[英]`componentWillMount` warnings visible even though 'componentWillMount' is not explicitly used

在我的代码中，我没有明确使用componentWillMount ，但是在运行webpack时仍然看到一些警告。 react-dom.development.js:12386 警告：componentWillMount 已重命名，不推荐使用。有关详细信息，请参阅 https:/fb.me/rea ...

反应 | 将数据从父组件传递给子组件

[英]React | pass data from parent to child component

在 React 中，我有类似的文件 parent.js包含文本框和按钮 child.js包含 P 标签 App.js包含父组件和子组件问题在按钮单击时将来自父级的文本框值传递给子级并在子段落标记中显示该值。完整代码堆栈闪电战 ...

在反应中的 url 更改上重新呈现相同的组件

[英]Re-render same component on url change in react

我有一条路线，它采用一个 id 并为每个 id 呈现相同的组件，例如： <Route path='/:code' component={Card}/> 现在我在 Link 标签中将一个 id 传递给组件。现在 Card 组件根据传递的 id 获取额外的细节。但问题是它只为一个 id 呈 ...

React 道具：我应该传递 object 还是它的属性？这有什么区别吗？

[英]React props: Should I pass the object or its properties? Does it make much difference?

传递道具时，我应该将整个 object 传递给子组件，还是应该先在父组件中单独创建道具，然后再将这些道具传递给子组件？传全object：单独创建首先需要的道具：哪个是首选，如果它取决于，我应该使用什么作为衡量标准来使用它们？ ...

我们可以将 setState 作为 props 从一个组件传递到另一个组件，并在 React 中从子组件更改父状态吗？

[英]Can we pass setState as props from one component to other and change parent state from child component in React?

在这里，我绑定了 setState 函数并将其作为道具发送给子组件。这将从子组件更改父组件的状态。这是正确的方法吗？ ...

何时使用 React.PropsWithChildren

[英]When to use React.PropsWithChildren

在我看来，两个类似的设置，在一台机器上我被允许调用 MyApp 有 class 签名的地方在另一台机器上，运行npm run-script build失败 TypeScript 构建错误 TS2322：类型“...”不可分配给类型“...” 'IntrinsicAttributes &amp ...