问题标签 [react-jsx]

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

javascript - react js,props或state中的两种方式绑定使用什么?

我正在尝试使用 reactjs 创建一个表单,我正在尝试双向绑定。我无法在 valueLink 中使用道具,因为它只能采用 state 。

问题 1:我在创建组件时传入属性,在 getInitial 状态下我将其设置为 state,因为我不能在 valueLink 中使用道具。更好的方法是什么?

我想在文本框中发送每个更改以在服务器中进行一些计算并将计算的值设置为状态。

问题 2:我无法使用方法 componentWillReceiveProps,因为我使用状态。我也无法使用 shouldComponentUpdate,因为我无法执行 setState。我可以在这里使用什么?

0 投票
2 回答
95922 浏览

reactjs - ReactJS:onClick处理程序放置在子组件上时不会触发

我最近开始使用ReactJS. 具体来说,我正在使用react-rails红宝石宝石和react-bootstrap组件。

我有一个关于onClick在子组件中放置事件侦听器的问题。

正如您从下面的代码示例中看到的,我有一个父组件,它在其render函数中“调用”一个子组件。在该render函数中,我有 ReactonClick侦听器,在单击它时会调用handleToggle它。


不幸的是,这并没有像我想象的那样工作。ToggleIconButton::handleToggle永远不会被调用。相反,onClick监听器被放置在IconButton和引用上ToggleIconButton::handleToggle

React 开发工具屏幕


我不想在IconButton. 在我看来,不应该将条件逻辑放在IconButton. 它应该做的只是代表一个图标和按钮,而不必担心任何浏览器事件。这ToggleIconButton就是为了。

虽然我知道我可以环绕React Div并在那里IconButton写一个onClick监听器(我已经尝试过并且它有效),但这似乎有点笨拙。

有人知道这样做的好方法吗?多谢你们!

0 投票
2 回答
10475 浏览

javascript - Reactjs:未捕获的类型错误:未定义不是函数

我是 Reactjs 的新手,我正在尝试执行 CRUD 操作。但是我在执行删除事件时遇到了问题。这是我的屏幕的外观:![在此处输入图像描述][1]

我的代码如下所示:

我知道我犯了一些愚蠢的错误,但我找不到解决这个问题的帮助。请帮我整理一下。

先感谢您。

0 投票
2 回答
10493 浏览

zurb-foundation - 如何让 react.js 和 zurb 一起玩得很好显示模态形式

我正在尝试将 zurb 显示与表单集成到反应组件中。到目前为止,下一个代码正确显示了模态形式:

Form组件非常标准:

问题:当我在模态表单组件中呈现表单组件并在表单输入中输入内容时,我在控制台异常中看到Uncaught object。这是一个堆栈:

如果我只是直接在父组件中渲染表单组件,那么一切正常。有人可以帮忙吗?

0 投票
1 回答
1047 浏览

javascript - 我的浏览器脚本无法运行

我编写的javascript在通过grunt使用browserify编译后,对网页没有任何影响——即使console.log语句也不起作用,但它在我的javascript中也没有报告任何有意义的错误,即使我介绍了它。我有一个看起来像这样的 Gruntfile.js:

基本上,它的作用是获取 socket.io 和 React 库,并将它们浏览到一个文件 lib/libs.js 中,并获取我的 main.js 文件,并将 socket.io 和 react 定义为外部库编译速度,通过 reactify 过滤器(它是一个 JSX 文件),将其缩小,然后将其放入 frontend/lib/main.js。

main.js 文件非常简单,现在它有几个测试console.log语句,但是这些都没有出现在控制台中,所以我很难理解如何使它工作。所有控制台日志是:

Gruntfile 运行没有错误,我可以读取 frontend/libs/main.js,并且它被适当地缩小和反应。

这是 main.js 文件,原始文件:

和编译版本:

我很困惑,希望你们能帮助我。如果您想了解更多信息,我很乐意提供。

0 投票
2 回答
379 浏览

reactjs - 组件未呈现

我是新手,我正在尝试构建一些东西来学习它的概念。

我已经创建了一些反应组件,但无法弄清楚为什么我的Post组件在 JSON 请求成功完成后没有被渲染。

注意:PostsPostList组件正在渲染没有问题。

我在这里想念什么?

ps:我正在通过 rails 助手渲染 Posts 组件,但您可以假设它工作正常。

先感谢您 :)

0 投票
1 回答
3316 浏览

reactjs - 在 reactjs(JSX) 中使用事件监听器

我正在尝试学习 Reactjs,但我无法解决。我想将粘性标题类添加到使用 Reactjs 呈现的表中,但我没有使用此代码/伪代码取得任何成功。

我正在尝试使用这个 Javascript 函数:

但我没有取得任何成功。有没有更简单的方法在 Reactjs 中实现 javascript 函数?

0 投票
1 回答
1155 浏览

javascript - Add component to every reactJS component

I'm trying to place a navbar on the top of all of my pages. Here's the router:

Note the hash parameter in the Locations tag. When I use the router as such, the links in the <NavBar /> component don't use hashes. However, if I include <NavBar /> in each of my individual components, then the hash linking works as expected. Is there a single place where I can include the <NavBar /> such that it's rendered on all pages displayed by the router?

0 投票
1 回答
1929 浏览

javascript - 在 React JS 中处理关键事件

我正在使用 Javascript (React JS) 构建一个需要监听左右箭头键的组件。我的组件是一张包含图像列表的卡片。单击图像时,会显示它,但我希望能够按左右箭头键并导航图像。

我有一堆嵌套的 div,我试图找出应该分配 onKeyPress 侦听器的那个。现在我将它分配给了许多 div,但我没有看到任何事件被触发。

0 投票
1 回答
145196 浏览

html - 在 JSX 和 React 中使用 onBlur

我正在尝试创建一个密码确认功能,该功能仅在用户离开确认字段后才呈现错误。我正在使用 Facebook 的 React JS。这是我的输入组件:

这是 renderPasswordConfirmError :

当我运行该页面时,输入有冲突的密码时不会显示该消息。