如何用几乎相同的JSX结构重构组件

文章/答案/技术大牛

发布

0回答

javascript、reactjs

我有一组组件，它们具有几乎相同的JSX结构。这些组件是Panel、SidePanel、Card和Modal。唯一的区别是className，因为我对CSS类名使用了BEM命名约定，事件处理函数以及事件处理函数在哪里被触发以及如何被触发。我应该如何重构这些组件，以防止到处使用重复的JSX？下面是来自my Panel和SidePanel组件JSX两

浏览 0提问于2017-12-05得票数 1

回答已采纳

3回答

重构几乎相同的组件，formik反应

reactjs、refactoring、higher-order-components、formik

我有两个相同的组件，只有很少的区别(一个)。有两个重复的代码和样板，但我不知道如何重构这一点，所以我只需要提供一个配置。PropTypes.func.isRequired,}; 如果你是我怎么重构这个我的想法是临时的，但我不知道如何叫“孩子”，这是不同的</em

浏览 0提问于2019-01-01得票数 0

回答已采纳

2回答

ReactJS子组件目录结构

reactjs、directory-structure

我有一个目录结构为App/ - components - - SubComponent1 - - - components - - - - SubSubComponent1 - - - - -- stores - actions - app.js的ReactJS应用程序模块组件的设计方式是，它的所有子组件都保留在Components文件夹下的自己的目录中。组件也有自己的组件</em

浏览 0提问于2015-06-09得票数 6

2回答

我应该创建新的组件还是适当地呈现js？

javascript、reactjs、dom、jsx

我有一个案例，我需要在另一个地方重新呈现一个反应组件。因此，例如，我有一个索引组件，其中有一个用户列表和这个列表的过滤器。现在，我需要在不同的地方呈现这个组件，但是没有过滤器。我是应该创建一个几乎相同的索引组件并跳过呈现过滤器，还是应该传递prop并呈现条件JSX？<Filters /> : null } ...some jsx<

浏览 5提问于2022-04-28得票数 0

1回答

重用复杂的Angular4、ngrx组件/模块

angular、ngrx

我有一个复杂的组件，它有一个大的状态和大量的动作和功能，如虚拟滚动，撤消-重做，拖放等功能。所有这些都是使用ngrx和ngrx制作的，非常容易和优雅地处理所有这些。但是有太多的智能组件在其中注入了存储，实际上还有许多转储组件也在分派操作。现在的问题是，相同的组件/模块将在另外两个位置使用，相同的数据结构</e

浏览 1提问于2017-10-15得票数 1

3回答

导入与其所在目录同名的JavaScript文件

javascript、reactjs、import、webpack、structure

在我的React和Webpack项目中，我有以下React组件的项目结构：├── Component.jsx└── styles.cssimport Component from '../Component/Component&#x

浏览 1提问于2017-02-28得票数 9

回答已采纳

1回答

反应钩子-修改状态不能立即反映

reactjs、typescript、react-hooks

我试图使用React挂钩将类重构为无状态组件。当用户单击按钮(按钮通过道具传递给我的组件)时，组件将显示弹出窗口。我在hooks 版本中评论了不能按我的要求执行的行export interface NodeMenuProps extends PropsNodeButton { title?: <e

浏览 0提问于2018-11-22得票数 10

1回答

如何从Reactjs+Reflux应用程序中的组件中正确初始化存储？

reactjs、reactjs-flux、flux、refluxjs

我有一个简单的导航栏用例 <NavBaractive={itemName} itemList={itemList} /> 问题是我的初始状态是{}，所以我的NavStore也是，因为不涉及外部数据，我应该如何用itemList信息初始化NavStore.js我尝试在商店中添加一个助

浏览 3提问于2015-03-18得票数 1

1回答

在混合中，防止嵌套路由获取与父布局相同的数据。

javascript、reactjs、remix.run

假设我有类似于这样的路由目录结构：├── root.jsx ├── sales.jsx └── info.jsx 因此，我有一个销售路线，/sales，它将呈现sales.jsx组件。sales.jsx和sales/info.jsx都需要--来自外部api的相同的数据。但是，这个

浏览 10提问于2022-11-05得票数 0

回答已采纳

1回答

重新导出组件失败

javascript、reactjs

我正在处理一个React项目，其中每个组件的文件都包含在他们自己的目录中。我有一个component.jsx文件和一个index.js文件，用于重新导出组件的默认导出。这如预期的那样起作用。我想通过从主组件文件夹向目录级别再导出所有组件来简化导入语句。有关我当前的项目文件夹结构的示例，请参阅下面。/Alert'; 此时，导入工作将按照Login

浏览 5提问于2022-01-29得票数 2

回答已采纳

1回答

React，Storybook - TS2307:找不到模块“”Button“”或其可由SB解析的相应类型声明？“”

javascript、reactjs、typescript

我有一个由"create-reat-app“创建的纯React项目(只有一个按钮组件)，我使用绝对路径将按钮组件导入App.js。我已经添加了故事书，并得到错误的同时:导入{ Button，ButtonProps }从'Button'；项目结构：---Button.js &qu

浏览 1提问于2020-12-19得票数 0

1回答

Okta React + embedded SignIn Widget为所有登录尝试返回401

reactjs、okta、okta-signin-widget

我正在尝试使用Okta登录我的react应用程序。任何指定的用户 </Security>登录页面中默认的嵌入了Okta SignIn Widget，在这里react文档中提到了-- \ okta开

浏览 9提问于2022-07-21得票数 0

回答已采纳

1回答

用道具设置图像src

javascript、reactjs

当我试图使用src设置图像的props时，我得到了一个错误。组件，该组件包含图像： const Proje

浏览 1提问于2021-06-17得票数 2

回答已采纳

4回答

在响应无状态功能组件中的If-else

javascript、reactjs、react-router

我基本上是在重构我的React组件，以支持新的无状态功能组件。但是，我对函数组件中的if-else语法感到困惑。 <Home />最后，

浏览 7提问于2015-12-02得票数 13

回答已采纳

1回答

将React组件传递给HTML属性

javascript、reactjs

升级到Reactive16.0.0之后，我现在能够有效地返回没有任何包装器元素的简单字符串。但我也想做这样的事情： Some text text我想在title属性中得到一个格式化的字符串，但是我在那里得到了[object Object]。

浏览 1提问于2017-10-26得票数 11

3回答

将状态传递给兄弟姐妹onChange

reactjs

我有一个包含<input type="range"></input>元素的组件。在该组件中，我有一个函数，它在移动滑块时更改状态。我希望不仅能够使用该状态来更改span组件中的Slider标记，而且还可以使用其他两个同级组件来呈现相同的值。 <div&g

浏览 5提问于2021-01-31得票数 2

回答已采纳

1回答

如何重构几乎相同的两个结构，具有不同的平等？

c#、.net

我有两个几乎相同的两个结构，只有不同的实现Equals方法我应该使用接口吗？我想听听你的建议。

浏览 4提问于2022-09-29得票数 -1

回答已采纳

1回答

React状态与Redux状态(实际使用)

reactjs、redux

我的用法¦-- domains/FooManagement/Components/Editor.jsx <-- Most-parent of the editor ¦--选项卡上的onClick (嵌套共享组件)调用用Editor.jsx编写的回调，该回调更新Editor.jsx中的状态。此状态更改，然后重新选择新的</em

浏览 0提问于2017-11-17得票数 2

回答已采纳

1回答

如何在一个Webpack导入中访问sass变量？

reactjs、sass、webpack

我很难弄清楚如何在React组件的Sass文件导入中访问sass变量。下面是我当前的目录结构，其中我使用了Webpack来捆绑所有内容： Sample/ Sample.scss main.scssvariables.scss 在Sample.jsx内部，我正在导入Sample.sccs，然而，来自variables.scss的变量没有通过，因为我假设它们是独立

浏览 0提问于2016-02-28得票数 1

点击加载更多