问题标签 [reactjs]

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 回答
3446 浏览

javascript - React.js:批处理 setState 以确保只有一个 DOM 布局/绘制

我有一个 onWheel 处理程序正在执行 setState,它导致的布局多于绘制:

车轮布局车轮布局油漆

...通过将事件值更改批处理到一个 setState 来避免这种情况的任何好的模式?

(我认为这个内置有一些魔力。)

0 投票
1 回答
2483 浏览

node.js - 使用 React.js 虚拟 DOM 在 Node.js 上模拟画布

我正在尝试使用 React.js 框架中的虚拟 DOM 在 Node.js 中模拟画布,但我无法找出如何创建画布元素和访问 canvasContext。

我希望能够创建一个新的画布对象,获取上下文并画几条线。

这就是我到目前为止所想出来的(在 npm install react 之后)

我应该在其他地方创建画布吗?如何访问画布上下文?

谢谢!

0 投票
3 回答
14657 浏览

event-handling - 如何在react.js中从父组件覆盖子组件的事件处理函数

我已经创建了一个按钮和文本组件,并将它们包含在一个搜索组件中,现在我想用搜索组件的处理程序覆盖按钮的默认 handleClick 事件。但是 this.handleClick 指向按钮组件的事件处理程序..请帮助..我需要在点击时从搜索而不是从按钮..

0 投票
5 回答
15897 浏览

jquery - 通过 BlueImp FileUpload jQuery 插件使用 ReactJS 上传文件

这是 ReactJS 的新手。

谁能建议使用什么或如何在 React 中上传表单(带有几个输入框和一个文件选择器)?

尝试使用BlueImp JQuery-file-upload plugin一直在破坏我的神经。错误消息是神秘的,并且未能从谷歌获得任何有用的帮助。

我的代码如下:

谢谢!

0 投票
3 回答
90322 浏览

javascript - Infinite scrolling with React JS

I am looking at ways to implement infinite scrolling with React. I have come across react-infinite-scroll and found it inefficient as it just adds nodes to the DOM and doesn't remove them. Is there any proven solution with React which will add, remove and maintains constant number of nodes in the DOM.

Here is the jsfiddle problem. In this problem, i want to have only 50 elements in the DOM at a time. others should be loaded and removed as user scrolls up and down. We have started using React because of it's optimization algorithms. Now i couldn't find solution to this problem. I have come across airbnb infinite js. But it is implemented with Jquery. To use this airbnb infinite scroll, i have to loose the React optimisation which i don't want to do.

sample code i want to add scroll is(here i am loading all items. My goal is to load only 50 items at a time)

#xA;

Looking for help...

0 投票
4 回答
25211 浏览

javascript - 如何在 ReactJS 中有条件地加载组件

这是来自 ReactJS 的新入门者。容易掌握的资源不可用促使我再次敲门。问题是这样的。我有一个 React 组件,RegisterAccount当单击它时会发射另一个组件(弹出窗口),允许用户填写注册帐户所需的详细信息。现在一旦成功注册了一个帐户,我想将注册的帐户作为另一个组件添加到RegisterAccount. 如何设置此通信?

0 投票
2 回答
5308 浏览

reactjs - React:不理会组件的内容

是否可以让 React 忽略子树?即,不比较或更新它?

我的用例正在迁移到 React。一次重写我们所有的 Handlebars 模板是不可行的,但是如果我们可以将现有模板用于某些子组件,我们可以随着时间的推移慢慢采用它。

0 投票
11 回答
198186 浏览

javascript - ReactJS 两个组件通信

我刚开始使用 ReactJS 并且有点卡在我遇到的问题上。

我的应用程序本质上是一个带有过滤器的列表和一个用于更改布局的按钮。目前我正在使用三个组件:和<list />,现在很明显,当我更改设置时,我想触发一些方法来更新我的视图。< Filters /><TopBar />< Filters /><list />

我怎样才能让这 3 个组件相互交互,或者我是否需要某种全局数据模型来进行更改?

0 投票
2 回答
891 浏览

reactjs - ReactJS:.map(array) 中的事件未触发

在我的render函数中,我想显示一个基于数组的列表,虽然显示它工作正常,但似乎我绑定到它的任何事件都被忽略了。

我直接在外面渲染了一个列表项.map,看看它是否会给出任何结果,这似乎是唯一一个有效的。

我只是遗漏了一些明显的东西,还是将事件放在外面时被忽略了return()

0 投票
0 回答
13331 浏览

javascript - Facebook 的 React 与 Web 组件(聚合物)的优缺点

Facebook 的React相对于即将到来的Web Components规范的主要优势是什么,反之亦然(或者可能与 Google 的Polymer库进行更全面的比较)?

根据这个 JSConf EU talk和 React 主页,React 的主要好处是:

  • 使用组件模型解耦和增加内聚
  • 抽象、组合和表现力
  • 虚拟 DOM 和合成事件(这基本上意味着它们完全重新实现了 DOM 及其事件系统)
    • 在 IE 8 上启用现代 HTML5 事件内容
    • 服务器端渲染
    • 可测试性
    • 绑定到 SVG、VML 和<canvas>

除了这个虚拟 DOM 概念(显然)之外,几乎所有提到的内容都通过 Web 组件本地集成到浏览器中。我可以看到虚拟 DOM 和合成事件在今天如何有益于支持旧浏览器,但是从长远来看,扔掉大量的原生浏览器代码是不是有点像在踢自己的脚?就现代浏览器而言,这不是很多不必要的开销/重新发明轮子吗?

以下是我认为React 缺少的一些 Web Components 会关心的东西。如我错了请纠正我。

  • 本机浏览器支持(阅读“保证更快”)
  • 用 vanilla JavaScript 编写 JavaScript,用 CSS 编写 CSS,用 HTML 编写 HTML。
  • 使用 Shadow DOM 进行样式封装
    • React 有this,这需要在 JavaScript 中编写 CSS。不漂亮。
  • 双向绑定