问题标签 [react-popper]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
5209 浏览

javascript - react-popper:使用 scheduleUpdate 重新定位

单击按钮后,我正在使用React-popper显示日期选择器元素。

JSX

单击按钮后调用时onDateRangeBtnClick,我想通过调用方法重新定位 Popper 元素scheduleUpdate,但我不知道如何处理。

如何在 JSX 本身中公开scheduleUpdate要调用的特定函数,onDateRangeBtnClick或者如何有条件地调用scheduleUpdateJSX 本身的函数(就此而言)?

0 投票
2 回答
4056 浏览

popper.js - 反应波普尔。如何移动元素相对父级?

我正在尝试移动父组件内部的 Popper。我该怎么做?

我尝试在修饰符对象中使用偏移属性。例如:

但是 offset 只会将 Popper 朝一个方向移动。如果展示位置={'top' || 'bottom'} => 如果placement={'right' || 它会左右移动 'left'} => 它上下移动。

0 投票
0 回答
683 浏览

reactjs - React-Popper + 使用 Hooks 的自定义组件

我有一组不应在内部使用 react-popper 的组件。我正在尝试将它们用作react-popper的参考。我知道解决方案是使用 forwardRef,但是,我花了几个小时试图做到这一点,但没有取得很大成功。

有没有人可以为一个简单的案例提供样本?这是一个需要内部引用的简单文本框组件:应该如何重写或包装它以用作引用?

0 投票
1 回答
1303 浏览

javascript - Popper.js React Wrapper - React.createElement:类型无效

我正在尝试从这里实现独立示例,使用react-popper- 我现在基本上只是复制粘贴的代码。它确实渲染了组件。但是,当我单击时,一切都会中断。我在 Gatsby.js 中使用它——如果这会有所作为?

这就是我得到的错误:

index.js:2177 警告:React.createElement:类型无效 - 应为字符串(用于内置组件)或类/函数(用于复合组件)但得到:未定义。您可能忘记从定义组件的文件中导出组件,或者您可能混淆了默认导入和命名导入。

在 StandaloneExample.js:36 检查您的代码。

和:

Uncaught TypeError: Object(...)(...) is not a function at InnerPopper.render (Popper.js:159)

和:

上述错误发生在组件中:in InnerPopper (created by Context.Consumer) in Popper (at StandaloneExample.js:34)

以及其中的多个:

TypeError: Object(...)(...) 不是函数

这是我的代码:

我已经修改了一些东西(我实现状态的方式等),因为我认为这可能会解决我遇到的错误,但它没有。除此之外,代码与沙盒示例中的代码几乎相同 - 我不确定它在哪里中断。

编辑:我正在导入这样的东西:

并在我的渲染函数中使用它,如下所示:

0 投票
2 回答
8169 浏览

javascript - 如何使用带有渲染道具的 react-popper

我是初学者,想了解一下react-popper。在他们的github 上,这是示例代码:

这是因为它应该在那里工作吗?Example我不确定我是否理解如何使用此代码,如果我将这个组件导入/使用到我自己的父组件中会是什么样子;我需要通过refs吗?怎么会这样?如果有人能给我这个代码的工作示例,那就太好了,我只想看看如何使用它。

0 投票
2 回答
114 浏览

reactjs - React(不确定变量来自哪里)

我是 React 新手,正在尝试了解 React-Popper。这是一些代码

https://www.npmjs.com/package/react-popper

“ref”、“style”、“placement”和“arrowProps”的值来自哪里,我将如何编辑它们?我知道您可以使用 this.props 和属性将值传递给组件,但我不明白要插入函数的值来自哪里。

0 投票
1 回答
1003 浏览

npm - “popper”和“popper.js”是 npm 中的两个不同的包吗?

我正在关注使用此命令安装 popper 的教程: npm install popper --save. 但是当我尝试它时收到此错误消息:致命错误 - 检测到 cygheap 基本不匹配 - 0x13A1410/0x13D1410

所以我搜索找到这个库的 github 页面并找到了这个页面:https ://github.com/FezVrasta/popper.js但我看到它建议安装它:npm install popper.js --save它与我的教程不同。现在我想知道这些与图书馆不同吗?如果它们不同,它们的 github 页面是poppe什么?popper.js

我还必须提到,我没有说 python popper 库。我想要 .js 使用的 javascript 版本bootstrap4

0 投票
1 回答
4044 浏览

css - 如何自定义 react-popper 箭头

如何设置与popper相同的箭头样式

代码沙箱:https ://codesandbox.io/s/bold-shape-lomrm

0 投票
8 回答
81594 浏览

jquery - 如何修复此错误:“找不到模块:无法解析 popper.js”

导入 Bootstrap 和 Jquery 后,编译时会显示此错误。

0 投票
1 回答
1666 浏览

popper.js - Popper-react 离开容器边界

我设置了一个发生这种情况的简单示例,请注意工具提示如何获得 translate3d(-45px, 147px, 0px) ,从而将其呈现在窗口边界之外:

https://codesandbox.io/s/stupefied-blackwell-nll6m