如何从客户端使用道具呈现React组件
基础概念
React 是一个用于构建用户界面的 JavaScript 库。组件是 React 的核心概念之一，它们是可重用的 UI 块。道具（Props）是 React 组件之间传递数据的一种方式。道具是只读的，子组件不能修改它们。
相关优势
- 组件化：React 组件使得代码更加模块化和可重用。
- 单向数据流：通过道具传递数据，确保数据流的单向性，使得应用更容易理解和维护。
- 灵活性：道具可以传递任何类型的数据，包括字符串、数字、对象、数组、函数等。
类型
道具可以是以下几种类型：
- 字符串：最简单的道具类型。
- 数字：用于传递数值。
- 布尔值：用于传递布尔值。
- 对象：用于传递复杂的数据结构。
- 数组：用于传递多个值。
- 函数：用于传递回调函数。
应用场景
道具在 React 组件中的应用非常广泛，常见的场景包括：
- 传递数据：将数据从父组件传递到子组件。
- 控制行为：通过传递函数来控制子组件的行为。
- 配置组件：传递配置信息来定制组件的行为和外观。
示例代码
假设我们有一个简单的 Button 组件，它接受一个 label 和一个 onClick 函数作为道具。
// Button.js
import React from 'react';
function Button(props) {
return (
<button onClick={props.onClick}>
{props.label}
</button>
);
}
export default Button;在父组件中使用 Button 组件：
// App.js
import React from 'react';
import Button from './Button';
function App() {
const handleClick = () => {
alert('Button clicked!');
};
return (
<div>
<Button label="Click me" onClick={handleClick} />
</div>
);
}
export default App;遇到的问题及解决方法
问题：道具未正确传递
原因：可能是由于拼写错误、类型不匹配或未正确导入组件。
解决方法：
- 检查拼写：确保道具名称在父组件和子组件中拼写一致。
- 类型匹配：确保传递的道具类型与子组件期望的类型匹配。
- 导入组件：确保正确导入子组件。
// 错误示例
<Button labal="Click me" onClick={handleClick} />
// 正确示例
<Button label="Click me" onClick={handleClick} />问题：道具函数未触发
原因：可能是由于函数未正确绑定或传递。
解决方法：
- 绑定函数：确保函数在父组件中正确绑定。
- 传递函数：确保函数作为道具正确传递。
// 错误示例
const handleClick = () => {
alert('Button clicked!');
};
<Button label="Click me" onClick={handleClick()} />
// 正确示例
<Button label="Click me" onClick={handleClick} />参考链接
通过以上内容，你应该能够理解如何从客户端使用道具呈现 React 组件，并解决一些常见问题。
相关·内容
虽然很明显，为什么React在默认情况下不对其所有功能组件执行React.memo，并且我们应该在需要时自行包装功能组件。
在我的例子中，我有一个大型的react项目，其结构如下：
const MyBigApp = () => {
const shouldShowX = useSelector(getShouldShowX);
const shouldShowY = useSelector(getShouldShowY);
// Many more selectors
return (
<>
{shouldShowX &&
浏览 1提问于2020-08-17得票数 13
4回答
我有一个屏幕，用户需要在游戏开始前等待几秒钟。在此阶段，react组件需要显示使用某个游戏id加入游戏的玩家的编号。当新用户加入屏幕时，如何更新老用户的屏幕？如何在另一个用户触发事件时呈现组件，并且此更改反映在所有user screens.thank you中。
用户-活动-反应组件-注释
用户A -->登录-> <<用户A加入了从计算机A加入的>>用户A
用户B -->登录-> <<用户A，B加入了从计算B加入的>>用户B
用户C -->登录-> <<用户A，B，C从计算机X加入>>
浏览 0提问于2021-01-26得票数 0
2回答
我正在研究关于在react中重用代码的模式，我遇到了这种方法--呈现道具。这里我不明白的一件事是，您是如何实际重用一个函数的，我了解状态是如何被共享的，但是如果您想重用一些函数，您如何做到这一点呢？我是张贴一些样例代码，我从官方网站的反应，并增加了一个额外的功能。
class Cat extends React.Component {
render() {
const mouse = this.props.mouse;
return (
<img src="/cat.jpg" style={{ positio
浏览 6提问于2020-01-27得票数 2
回答已采纳
我是新来的。我在看他们的医生了解反应是如何运作的。因此，有人提到，当state/props/setState()更改/调用时，重新响应整个组件。
此外，我还看到react元素是不可变的，只有在发生更改时才会呈现它们。因此，当react试图呈现组件时，它实际上遍历所有元素，检查差异，并且只呈现数据被更改的元素。它不会简单地重新呈现整个组件。
我说得对吗？还是我的理解错了？
浏览 8提问于2020-10-23得票数 3
回答已采纳
我正在为一个简单的React组件编写一个测试，该组件使用props传入对象，然后将文本从该对象加载到屏幕上。下面是我得到的信息： QuoteBox.js import React from 'react'
export default class QuoteBox extends React.Component {
constructor(props) {
super(props)
}
render() {
return (
<div
className='quote-box'
浏览 14提问于2020-09-18得票数 0
回答已采纳
import React from 'react';
import SearchDocument from './components/searchDocument';
import CreateRequest from './components/createRequest';
import { BrowserRouter as Router } from "react-router-dom";
import { Route, Switch } from 'react-router-dom';
class App
浏览 2提问于2018-04-19得票数 1
回答已采纳
1回答
当UI事件发生时，我的顶级React组件接收来自外部对象的数据作为道具使用。我想知道更新组件的道具以用于下一次渲染的正确方法。
似乎其中一个组件生命周期方法应该处理这个问题，但情况似乎并非如此。
下面的代码显示了我尝试过的内容：
·一旦数据准备就绪，Root.update**:**自定义方法就会被外部调用。这两种技术都能发挥作用。
·Root.getDefaultProps**:**用于检索道具以进行第一次渲染。
·Root.render**:**也能工作，但在第一次渲染时是多余的。
·Root.componentWillUpdate**:**不起作用，但似乎应该起作用。
·Root.comp
浏览 0提问于2015-07-20得票数 1
回答已采纳
我试图理解何时使用React纯组件以及何时使用常规组件。我有个简单的问题。
给定相同的道具和相同的状态，组件如何呈现不同的结果？
如何确定道具物体浅层比较的极限？我还没有在道具中使用嵌套属性，但应该始终使用纯组件吗？
下面引用的话说，当父组件是纯的时，所有的子组件都不会重新呈现，比如我们理解并确保了这一点，但这是否也意味着我们必须将子程序封装在纯组件中，或者它们作为常规组件很好？
此外，React.PureComponent的shouldComponentUpdate()跳过整个组件子树的支持更新。确保所有的子组件也是“纯的”。
最后一个是。以下引用的官方文档意味着我们无法访问常规组件
浏览 1提问于2018-10-24得票数 1
2回答
我最初使用的是来自react-router的react-router，并以编程方式使用this.props.history.push()导航我的React应用程序。但是，随着从HashRouter包开始使用react-router-dom，this.props.history.push()现在抛出一个Cannot read property 'push' of undefined错误。
现在如何使用HashRouter以编程方式导航？
ReactDOM.render(
<Provider store={store}>
<MuiThemeProvid
浏览 2提问于2017-05-26得票数 7
回答已采纳
我想知道如何将JSX (如"div“或"span")传递给我自己的组件。因此，我尝试使用React.ReactType来支持两者。我的代码如下所示：
LazySvgIcon.tsx
import * as React from 'react'
interface Props {
src: string
loading?: React.ReactType
error?: React.ReactType
}
interface State {
isLoading: boolean,
hasError: boolean
}
expor
浏览 0提问于2019-01-29得票数 0
我被告知，如果父母的道具发生变化，孩子不会重新呈现，而是如果父母的状态发生变化。
在下面的情况下，当我单击按钮，子重呈现，这是合理的，因为它的父母的状态是被触发的，但我不知道为什么孙女也得到重新渲染！它的父母的状态(孩子的状态)没有改变。
那么这里的规矩是什么？
会是什么情况：
1)应用程序只呈现一个子和外孙呈现？
2)应用程序呈现但独生子女不呈现孙女？
顺便说一句，我不是指如何使用或pureComponent，我只是想知道React如何呈现嵌套的子程序:)
import React, { useState } from "react";
const App = () =&g
浏览 1提问于2019-11-17得票数 2
回答已采纳
3回答
我的反应组件“Person”在屏幕上打印了两次，一次没有道具，一次带有道具。
//App.js
import React, { Component } from 'react';
import './App.css';
import Person from './Person/Person'
class App extends Component {
render() {
return (
<div className="App">
<h1>Hello I am
浏览 3提问于2018-05-27得票数 0
回答已采纳
1回答
如何正确地将参数从一个组件传递到另一个组件。在我的场景中，当我通过控制台将pass参数记录到另一个组件时，它们在最后一个组件中的实际字符串之前有一个空字符串。它应该只是实际的字符串。
组件1：
import React, {useState, useEffect} from 'react'
import {dataComponent} from './include/childComponent'
export default function Parentcomponent(props) {
const [data, setdata] = u
浏览 9提问于2019-08-02得票数 0
回答已采纳
在本例中，componentDidUpdate是在设置状态跟踪时触发的。HelloMessage道具和状态没有改变，所以为什么要调用这个方法？如何防止这种情况发生？
class HelloMessage extends React.Component {
componentDidUpdate(prevProps, prevState) {
console.log('HelloMessage did update');
}
render() {
return <div>Hellooo</div>;
}
}
class A
浏览 0提问于2018-08-17得票数 1
回答已采纳
请告诉我why my header render every time already use React.memo ?，当我从my apps到user header的导航时，我有两部分my app and user，为什么？
这是我的密码
import React, { useEffect, useState } from "react";
import { withRouter } from "react-router-dom";
const Header = React.memo(function() {
console.log("Head
浏览 2提问于2020-04-22得票数 3
回答已采纳
我想知道如何最好地呈现服务器端(而不是在客户机上呈现)和处理来自异步查询的状态更改。
理想的例子：
服务器获得生成HTML的请求
服务器“需要”一个react组件，传递一些道具
react组件在服务器中呈现，但它必须执行Ajax/Socket查询才能获得一些信息。事件将被发送，响应将在稍后出现。
react组件改变状态，更改输出。
生成的HMTL已经就绪，并具有最新的状态更改。
这里发生的事情是，ReactDOM.renderToStaticMarkup()，如预期的那样，不会等待组件完成状态更改(在本例中，等待数据并重新呈现)。
澄清：
这里没有客户，这不是典型的
浏览 2提问于2016-02-24得票数 0
回答已采纳
我没有多少运气使用redux版本的redux-路由器。当我将产品添加到购物车时，位置确实会改变，但是页面不会更新。
到目前为止这是我的安排。其他所有功能都与新路由器一起工作，将项添加到购物车中，成功地从REST服务器返回。但是，在操作文件中使用push并不会更新页面。
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, applyMidd
浏览 1提问于2017-04-16得票数 3
我创建了一个简单的react应用程序，并检查了这个应用程序为什么要重新呈现，它显示了不必要的重新呈现，以及如何防止这些重新呈现？
浏览 4提问于2016-09-28得票数 3
回答已采纳
简短的问题我希望你能帮上忙。
为什么要这么做？
constructor() {
super();
this.loader;
}
componentDidMount(){
this.loader = document.getElementById('loaderTest');
console.log(this.loader);
}
但这不是？
constructor() {
super();
this.loader = document.getElementById('loaderTest');
浏览 0提问于2017-08-31得票数 1
回答已采纳
我需要创建一个反应应用程序，让我们列出pokemons和类型。我从PokeAPI中获取数据。从App组件获取它然后将它传递给子组件是一个好做法，还是从子组件中获取它们更好？
我在主应用程序中获取它，我可以看到提取工作，因为我console.log数据，但我的组件没有得到它，因为我得到一个props.map不是一个函数。
这是我的App.js：
import React, { useState } from "react";
import logo from "./logo.svg";
import "./App.css";
import axio
浏览 4提问于2020-09-19得票数 1
回答已采纳
据我所知，React.memo()比较道具以查看组件是否应该重新呈现。但是，如果以前的道具和当前的道具是相同的，即使组件没有被React.memo()包装，React也不会重新呈现组件。那么，react.memo()在组件重新评估之前，而不是在重新呈现之前，比较道具？
浏览 10提问于2022-09-24得票数 0
在为<Formik /> 提供的示例中，我们可以使用以下代码访问子程序中的Formik上下文道具：
import React from 'react';
import { Formik } from 'formik';
const BasicExample = () => (
<div>
<h1>My Form</h1>
<Formik
initialValues={{ name: 'jared' }}
onSubmit={(values,
浏览 4提问于2019-12-05得票数 0
回答已采纳
我正在为菜单导航编写一个ReactJS应用程序，在该应用程序中，我在单击div并从其他元素中删除"selected“类时添加了一个"selected”类。现在，我陷入了如何从其他元素中删除类的问题--这是我的代码
<pre>
**App.js**
class App extends React.Component {
constructor(){
super();
this.state = {
active : "0",
}
}
clickHandler(index){
}
render()
浏览 0提问于2017-07-12得票数 0
回答已采纳
3回答
我正在学习本教程，和
这引入了一个AuthenticatedRoute，它检查名为isAuthenticated的道具的值，以决定是否呈现组件或将用户重定向到login。
import React from "react";
import { Route, Redirect } from "react-router-dom";
export default ({ component: C, props: cProps, ...rest }) =>
<Route
{...rest}
render={props =>
浏览 7提问于2017-09-18得票数 2
回答已采纳
最后一个有趣的例子是C8。React必须呈现这个组件，但是由于它返回的React元素与先前呈现的元素相同，所以它不必更新DOM。
所以这是从官方的反应文件上拿来的。
对于C8，SCU返回true，并且Virtual (上一个和下一个)是相等的。这怎么可能？
我能想到的唯一场景是当您将道具传递给C8时，而不是在C8的呈现方法中使用它们。
有人能用一个合适的例子来详细说明这一点吗？
浏览 1提问于2019-03-26得票数 1
3回答
不更新HTML画布
、、、
我在DrawingCanvas.jsx中有以下代码：
var _ = require('bower.js').lodash;
var React = require('bower.js').React;
var channel = require('com.js').channel;
var DrawingCanvas = React.createClass({
setCanvasImage: function(){
if(this.props.image != null)
{
//var canvas = Re
浏览 3提问于2015-10-05得票数 3
回答已采纳
我正在尝试在我的React.js应用程序上实现React.js路由器，但是当我将路由器添加到我的程序中时，我就开始收到一个奇怪的错误。
ReactDOM.render(
<BrowserRouter>
<App />
<Route path="/" component={Headline}></Route>
<Route path="/economy" component={Economics}></Route>
</BrowserRouter&
浏览 2提问于2020-10-30得票数 0
回答已采纳
1回答
我现在正在我的应用程序中使用React 17.0.2，react路由器-dom 6.0.2。
我尝试使用react上下文和路由在路由上添加身份验证。
在App.js中，我可以从AuthContext中获得价值
...
const { authState, authReducer } = useContext(AuthContext);
<Routes>
<Route element={PrivateRoute}>
<Route path="/dashboard/*" element={<MainLayou
浏览 4提问于2021-11-13得票数 3
我正在尝试使用React.js创建我的第一个web应用程序。
我希望React执行客户端呈现，但是呈现的页面由服务器承载的数据库中的数据控制。
我应该如何传递这些数据以作出反应？
我是否必须使用我的数据的json表示形式预先填充服务器端的每个html页面？
或者可以直接从客户端访问我的数据库(或者使用RESTful API调用)？
更新: 001
我可以找到的所有示例都在node.js上安装了node.js。我可以在Apache™、、Jetty上使用REACT.js吗？
浏览 6提问于2015-05-03得票数 3
回答已采纳
2回答
当我试图将反应性路由器-dom v5升级到v6时，我会得到类型记录错误，我如何修复这个类型记录错误。在下面您可以找到代码，谢谢
`
export function withRouter(ui: React.ReactElement) {
const history = useNavigate();
const routerValues: any = {
history: undefined,
location: undefined
};
const result = (
<MemoryRouter>
{ui}
<
浏览 18提问于2022-12-04得票数 2
如何在React.createClass()中处理自定义javascript属性？
下面是一个例子：
var RouterView = React.createClass({
mixins: [Morearty.Mixin],
isAuthorized: false, // should it be part of state ??
isVerified: false, // should it be part of state ??
bindToAuthorization: function() {
if(/* blah-blah-blah *
浏览 2提问于2015-12-17得票数 0
回答已采纳
1回答
在下面的程序中，当我单击任何按钮时，另一个按钮也会重新呈现，即使我已经使用了React.memo()。此外，只有其他按钮得到重新呈现，而不是其他计数。为什么？我有这样一个父组件：
import React, { useState } from 'react'
import Count from './Count'
import Button from './Button'
import Title from './Title'
function ParentComponent() {
const [age, setAge
浏览 2提问于2021-01-25得票数 1
父组件
父组件包含输入，它在更改时设置状态"sendLocal“，然后单击按钮获取”本地“状态的值，并将其设置为”sendLocal“
函数
转换处理程序:输入类型更改的触发器.
sendLocalValue :获取“本地”值，将其放入按钮单击"sendLocal“变量触发器中。。
sendValue :这个带有依赖的"sendLocal“的回忆录函数在子组件呈现后作为子组件中的支柱传递。
从“function”导入function，{ useState，useCallback }；从“./ ChildComponent”导入ChildComponent；函数Pare
浏览 5提问于2021-02-14得票数 0
回答已采纳
1回答
两次调用React组件
、、、
Portal组件被调用了两次。
为什么会这样？
我怎么才能防止这种情况？
index.js
const App = () => {
const theme = lightTheme;
return (
<Provider store={store}>
<StyleSheetManager>
<ThemeProvider theme={theme}>
<BrowserRouter>
<Portal />
</Bro
浏览 3提问于2021-05-18得票数 1
回答已采纳
如何避免对直接在typescript中呈现的组件注入React.children.map的道具进行类型检查？
type ContainerProps = {
children: JSX.Element[];
};
export const Container: React.FC<ContainerProps> = ({ children }) => {
const [isOpen, setIsOpen] = useState<boolean>(false);
return (
<React.Fragment>
浏览 0提问于2020-10-01得票数 0
1回答
我刚开始对React中的渲染过程感到困惑。
假设我有一个高阶组件，如下所示：
const withHOC = () => WrapperComponent => {
return class WithHOC extends React.Component {
render() {
//someProps => what will change...
//...rest => won't change
const { someProps, ...rest } = th
浏览 0提问于2018-08-28得票数 0
回答已采纳
3回答
在过去的两天里，我一直在学习React，并且我在理解URL参数方面遇到了困难。
假设我想要一条路线mysite.com/details/1023。该路线的定义如下：
<Route path="/details/:id" render={() => <DishDetails />}/>
现在，我希望在另一个文件中定义的DishDetails对象能够使用id值1023。我该怎么做？我已经在路由url params上找到了教程，但是没有一个说明如何实现这个目标。
下面是我的DishDetails视图现在的样子：
import React, {Compon
浏览 0提问于2018-03-29得票数 2
回答已采纳
我使用React渲染我的web应用程序所需的一些组件，我有一个带有播放和停止按钮的计时器。我从get请求中检索所有的时间记录，并且我想在组件每次更改时重新修改它，我如何做到这一点？
除了使用一个简单的setInterval来调用this.forceUpdate()函数之外，一切都可以正常工作，但这给了我一个警告：
警告:forceUpdate(.)：只能更新安装或安装组件。这通常意味着在未挂载的组件上调用forceUpdate()。这是禁止行动。请检查TimerBox组件的代码。
我的组成部分：
var TimerBox = React.createClass({
displa
浏览 3提问于2017-03-09得票数 0
回答已采纳
1回答
我正在通过学习如何编写同构的JavaScript应用程序来更新我的技能集。对于我的堆栈，我选择了React和Express -还没有数据库。
在编写这类应用程序时，许多人似乎面临的问题是从服务器获取数据到客户端，这样视图就可以正确地呈现在客户端。显然，最好的方法是对数据进行JSON编码，并将其包含在服务器呈现的页面中。
所有这些都已经完成，而且很有效，但是如果有人知道他们在做什么，在我养成坏习惯之前，能在我的技术上发挥作用的话，我会非常感激。
一个工作的存储库(非常小)是可在GitHub上获得，但是我在下面包含了有关代码的相关内容。
为了将数据传递给客户端，我通过React将其传递到基本模板，
浏览 0提问于2016-01-06得票数 2
回答已采纳
文件package.json
{
"name": "acc",
"version": "1.0.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^13.3.0",
"@testing-library/user-event"
浏览 8提问于2022-07-30得票数 0
我有一个react组件‘A’，它依赖于存储在提供程序组件‘B’的状态中的值‘x’。当‘x’被更新时，我需要重新呈现组件‘A’。我该如何实现这一点？‘x’的‘A’将如何更新？“b”对“A”有非常间接的访问权限。 我使用的是一个老版本的React，所以我不能使用钩子。
浏览 7提问于2020-06-10得票数 0
回答已采纳
1回答
我正在使用div在React中建立一个网格。我的Main组件有一个Settings组件和一个Boxes组件。
更改Settings中的值将更新Main中的状态值，该状态值将传递给Boxes。在Settings中更新此值将导致Boxes重登，因为它使用Main的状态值。
由于盒子的数量没有变化，我只想用JavaScript改变每个单独的盒子的宽度和高度。在这种情况下，重新呈现是不必要的。
我尝试在shouldComponentUpdate中实现我的宽度/高度更改代码，但这使得这些框完全不呈现，并抛出这个错误：警告: Boxes.shouldComponentUpdate()：返回未定义
浏览 0提问于2018-12-05得票数 1
在react-router版本0.13.3中，我有
Router.run(routes, createBrowserHistory, function(Handler, state) {
React.render(<Handler query={ state } path={ state.pathname }/>, document.getElementById('app'))
});
在react-router 1.0.0.rc3中，我有
let history = createBrowserHistory();
React.render(<Rout
浏览 0提问于2015-10-17得票数 3
3回答
我设置了一个React项目，以便从Firebase数据库中获取一个对象并将其呈现给我的页面。然而，我不知道如何正确地呈现数据。
我正在获取的数据如下所示：
{
"projects": {
"0": {
"title": "test",
"function": "test2"
},
"1": {
"title": "test3"
浏览 4提问于2016-08-24得票数 3
回答已采纳
2回答
我对状态的理解可能有些不对&反应中的道具。这是使用React，基于Redux的应用程序。
场景：
我有一个全局SVG组件，它从componentDidMount方法中的应用程序中获取视图端口的维数。
SVG在state中的默认支持(在应用程序初始化时)是：
dimension : {
width : 0,
height : 0
}
componentDidMount从DOM中检索width & height值，并将值分派到状态。
现在我有了一个SVG组件的子组件，它需要更新的svg宽度和高度值来计算默认视图框并再次更新状态。这只需要在挂载时执行一次(要点)，因此viewbo
浏览 2提问于2017-03-02得票数 1
回答已采纳
现在，我正在尝试学习如何在没有重定向页面的情况下构建单个page应用程序。因此，每一次更改UI都会通过按钮触发。但是，如果触发器按钮在另一个视图上，我很难实现它.
我构建了一个简单的代码，用按钮将路由视图从<Home/>更改为<Payment/>。
app.js
import React, {useState, useEffect} from 'react';
import Home from './views/Home';
import Payment from './views/Payment';
import
浏览 0提问于2022-05-08得票数 0
回答已采纳
我正在创建一个使用React，，React Redux&React持久化的网站。
我用防火墙建立了一个登录注册页面。当用户登录或注册时，我希望他们的显示名称在标头组件中。使用我当前的方法，我意识到当一个用户登录时，头组件每次都会重新呈现，但是我不太喜欢它，因为它不会使我的网站导航顺畅。当用户未登录时，标头组件不会重新呈现。
我对JS的反应相对较新，我正在阅读文档& googling其他类似的问题，但我找不到解决方案，也很难解决这个问题。如有任何帮助或建议，将不胜感激！
下面是我的index.js，App.js，header.component.jsx
index.js
impo
浏览 4提问于2020-08-20得票数 1
我有服务器端React/Redux/Express应用程序。React路由器v4为带有交换机的服务器应用程序提供了解决方案，我需要使用一些东西从NavBar组件中更改位置。
应用程序
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import { Switch, Route, Redirect, Link} from 'react-rout
浏览 8提问于2017-07-04得票数 5
我在从Reader.js组件访问一个名为Reader.js的参数时遇到问题。该参数是使用react路由器从BookCarouselItem.js传递的.Reader.js是一个连接组件。
我不确定这是否有什么区别，但是redux连接的组件是否有反应路由器呢？还是我需要使用像这样的东西？
我曾尝试过提到类似的问题，但未能找到解决办法，我将非常感谢帮助。
App.js
import React, { Component } from 'react'
import { BrowserRouter as Router, Route } from 'react-router-do
浏览 0提问于2018-08-03得票数 0
1回答
我有一个组件，它呈现“react图标”对象。但是，如果没有提供图标，我希望在UI上显示"NoIcon“字符串。
组件A就是这样的。
元件A
import React from 'react';
import { FaHeart} from "react-icons/fa";
const Icon = ({FaIcon = "NoIcon"}) => {
return (
<div>
<FaIcon/>
</div>
);
};
export default
浏览 3提问于2021-09-30得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
云直播
对象存储活动推荐
腾讯云开发者
