React获取组件外部元素的偏移量

文章/答案/技术大牛

发布

2回答

reactjs

我正在尝试获取React组件外部的元素的offsetTop、offsetLeft、offsetHeight等，并将这些值作为内联CSS传递给React组件。class MyComponent extends React.Component { super(props); bottom: bottom

浏览 89提问于2019-01-10得票数 1

回答已采纳

3回答

动态创建表索引

javascript、html、reactjs、tabindex

我正在寻找一种方法来动态地为我的React应用程序中的每个元素创建一个tabindex。有多个组件包含我想要为其创建tabindex的输入元素，我不知道如何协调它们并避免冲突。我的React应用程序由多个包含输入元素的表组成。在运行时，用户可以扩展表，创建额外的输入元素。我想改变用户通过这些输入选项卡的方向，但我不确定如何为每个元素</e

浏览 3提问于2017-05-22得票数 7

回答已采纳

1回答

使React.js了解香草JavaScript DOM更新

javascript、reactjs、react-fiber

让我们假设在React 16应用程序中有这个组件的层次结构：这些组件由具有非零高度的块HTML元素表示.在componentDidMount of component B中，我使用香草JavaScript来找出折叠元素的高度。这使得底层DOM发生了变异。在组件componentDidMount方法C中，我还使用香草JS从组件的顶部了解<e

浏览 1提问于2018-01-18得票数 0

3回答

如何将外部DOM附加到React组件？

javascript、reactjs

我有一个页面，其中一个表单呈现在服务器上，它处理验证和选择值的正确性。 render() { })

浏览 1提问于2015-09-30得票数 5

回答已采纳

1回答

如果通过标记设置，为什么内部组件完全呈现？这是一个bug吗？

javascript、reactjs

我遇到了一个令人费解的组件渲染行为。在我的示例中，有一个DataTable组件，您可以在其中编辑每个表格单元格的内容，下面是一段代码(请参阅上的完整示例)。因此，如果您调用内部component Table作为标记中的函数，那么如果您更改单元格中的数据，React将更新当前编辑的单元格。但是，如果您在标记中调用组件作为标记，并尝试编辑数据，则整个表都会更新！要么我不理解什么，要么这是Reac

浏览 39提问于2019-11-02得票数 0

回答已采纳

7回答

在React中获取div的offsetTop位置

javascript、scroll、reactjs、offset

我正在尝试在React中实现一个列表视图。我正在尝试实现的是存储列表头信息，并注册组件和注册scroll事件。每次用户滚动窗口时，我都想取出存储的div并重新计算offsetTop数据。现在的问题是，我发现在onscroll函数中，控制台只打印出初始值(值是固定的，永远不会改变)，offsetTop数据永远不会改变。有人建议如何从_instances对象中获取最新的offsetTop吗？import React, { Componen

浏览 630提问于2015-09-19得票数 75

回答已采纳

2回答

在父组件componentDidMount完成后呈现子组件

javascript、reactjs

它有一个特殊的道具，允许您传入用于获取DOM元素并返回底部值的字符串。这个id基本上是DOM中的另一个元素。因此，当该元素的底部值到达视图端口的顶部时，允许粘性组件在用户滚动时向上移动。我遇到的问题是我需要增加一个偏移量。Sticky组件允许您传递一个数字值。Sticky bottomBoundary={1200}> <MyChildCompo

浏览 1提问于2018-07-30得票数 2

回答已采纳

1回答

React:在渲染之前知道元素的大小

reactjs

假设一个组件在渲染之前需要知道它的大小。根据我的知识，我可以这样做:渲染组件，在componentDidMount中获取DOM节点并从中提取大小，用这个大小更新状态，然后再次渲染(不要让它与附加到窗口的resize事件的事件侦听器一起复杂化，让我们假设窗口没有调整大小)它可以工作，但看起来很脏，第一次渲染只是浪费资源，我想在渲染之前知道元素(或其容器)的大小，我知道大多数时候元素本身声明了大小，但在某些情况下，父<e

浏览 1提问于2016-06-18得票数 19

回答已采纳

1回答

如何在react中获取完整日历中的所有事件

reactjs、fullcalendar

我将react与fullcalender集成在一起(我的情况下，我必须将一些外部组件放到日历中)。浏览了他们的文档并遵循了他们的步骤，我终于能够将外部组件放入react fullcalendar中。但我不知道如何使用React获取Callender中的所有事件。有谁可以帮我？提前感谢 code sandbox of my repo 如果我将事件拖到另一个日期，我将从状态初始化数据。

浏览 17提问于2019-04-10得票数 0

2回答

尝试将用户从ul输入li到数组中

javascript、reactjs、ecmascript-6

id="recipeItems" /> 在另一个按钮按下，我试图让它采取的形式，并将它添加到一个对象，我有它的大部分工作，但我只是不知道如何从ul的成分到一个数组。它只是作为未定义的日志出来的。

浏览 3提问于2017-06-27得票数 0

回答已采纳

2回答

秒表组件未采用useEffect中设置的值

reactjs、typescript

我用npm包中的useStopwatch做了一个简单的秒表。我想在API调用中获取父组件中组件加载的起始偏移量，并将其传递给秒表。我试过这个： import Stopwatch from "./Stopwatch"; export default function

浏览 30提问于2021-11-18得票数 0

3回答

将按钮呈现为div，以避免继承按钮样式

html、reactjs、jsx

我们将React组件嵌入到我们的网站中。有一些应用于我们的按钮的基本样式，它们来自用户代理(例如，焦点上的轮廓)和我们嵌入React组件的HTML/CSS环境。我们希望我们的React组件是风格独立的。因为我们也在小部件中使用我们的组件，所以我们不能真正控制外部环境。一种解决方案是让我们的<

浏览 36提问于2020-03-18得票数 0

回答已采纳

1回答

在组件中反应呈现DOM HTML页面

javascript、reactjs

在我的React应用程序中，我使用的是标准组件。但是，当用户单击“保存和退出”选项时，应该将其重定向到来自外部位置的dom元素的页面：document.getElementById('thank-you')。window.document.getElementById('save-landing-page'), />}; 我认为，将其设置为显示内部HT

浏览 3提问于2020-10-14得票数 0

回答已采纳

1回答

在react路由器中，为什么页面的公共元素应该是路由器的子元素？

react-router、react-router-dom

我无法从代码中看出这是必要的或更好的。// ...

浏览 3提问于2021-03-26得票数 1

1回答

限制外部CSS对本地react组件或HTML元素的影响

javascript、jquery、html、css、reactjs

我在React应用程序的HTML页面中使用了很少的外部CSS。在呈现组件之后，外部CSS正在影响我的React组件UI并扭曲它们。但是，我需要外部CSS来呈现标题( HTML页面的特定部分)，但不影响页面元素的其余部分。是否有可能将此行为限制为页面中少数几个元素中的特定元素？我正在使用react-script

浏览 17提问于2019-05-17得票数 0

1回答

重新呈现一个React组件时，当它持有一个视频元素时，它就会变得很糟糕。

reactjs

React建议，如果由于外部事件而更改了这些props，则使用新的props完全重新呈现React组件。那么，处理这种情况的正确方法是什么呢？更新：忘了我的问题，这是错误的。每次道具变化时，视频元素都不会被销毁和创建。

浏览 1提问于2016-01-31得票数 1

3回答

返回前获取数据服务器端

javascript、node.js、reactjs、request、hapijs

使用Hapi和React，获取数据服务器端以生成视图的最佳方式是什么？我目前使用Elasticsearch作为我的数据源，并使用request库对其进行查询，但是由于javascripts的异步特性，数据永远不会按时加载，那么在返回视图之前如何加载数据呢？// searchvar request = require('request'); var

浏览 0提问于2016-04-17得票数 0

1回答

无法使用Jest/Enzyme测试面板内的组件

reactjs、enzyme、office-ui-fabric

我需要测试中的一个组件。如何使用Jest/Enzyme测试Panel中的元素？

浏览 13提问于2018-07-28得票数 1

2回答

在react中的组件之外使用组件的功能？

javascript、reactjs

onClick={() => Calendar.changeCurrDate(props.startDate)} ); })const DayScaleCell覆盖了我在Calendar组件中使用的外部组件中的元素当单击该元素时，

浏览 0提问于2019-04-20得票数 0

1回答

使用React- Native -Router-Flux在React* Native中嵌套场景*

android、reactjs、react-native、react-router、react-native-router-flux

使用DefaultRenderer元素，我已经能够创建单个嵌套场景，但我希望有多个，并且能够在它们之间导航。 component={Inner2} hideNavBar</Scene>

浏览 1提问于2016-12-06得票数 7

点击加载更多