问题标签 [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 回答
323 浏览

reactjs - HTML 到 jsx 转换器不保留 css 单元

我正在使用 react.js 的 HTML 到 JSX 转换器,此处演示:

https://magic.reactjs.net/htmltojsx.htm

并注意到一个奇怪的行为。

翻译这段代码时:

返回短语中的翻译是:

请注意,“px”已被删除。现在,虽然“fontSize”特性很好,但css中的“lineHeight”表现完全不同,14的行高根本不等于14px。

任何建议的解决方法或解释都将受到高度赞赏。

0 投票
4 回答
4198 浏览

reactjs - 每次 URL 更改时,带有 browserHistory 的 React 路由器都会转到服务器

我正在做类似的事情:

当我执行上述操作时,只要地址栏中的 URL 更改调用将转到服务器,但这不是我想要的,我希望第一次页面从服务器加载,但之后只要路由更改组件应仅在客户端加载。我在这里错过了什么吗?

在客户端,我正在做类似的事情:

我的路线看起来像:

现在,每当我这样做时location.href = "/page/xyz",它都会转到服务器并加载内容。

0 投票
0 回答
203 浏览

javascript - 无法读取 null 的属性“名称”。可以找人看看

我在这里有点束缚。代码应该是正确的,但 Chrome 一直说第 27 行有一个未捕获的类型引用。

它无法读取 null 的属性“名称”。我已经检查了这段代码大约三遍,但找不到它给我带来问题的原因。

希望另一双眼睛能看一看。

0 投票
1 回答
849 浏览

reactjs - 如果访问某些属性,React JSX 表单字段映射会失败

我正在尝试从表单字段数组构建表单,其中每个表单字段如下所示:

但是,当我尝试使用 JSX 对其进行映射时,如果我访问对象的某些属性,则字段不会成功显示。采取以下代码,它可以正常工作:

并将其与失败的代码进行比较:

精明的观察者会注意到两者之间的唯一区别是,在第二个中,我们记录的是formfield.label.text而不是 formfield.label

我完全不明白为什么简单地记录一个对象的孙子属性会导致表单显示为空(即,没有字段)。也许我遇到了保留名称或其他什么?任何想法表示赞赏。

0 投票
2 回答
305 浏览

reactjs - ReactJS 使用 JSX 或 Babel

我是 ReactJS 的新手。我应该使用JSXTransformer 还是 Babel 来编写 ReactJS代码?

我知道ReactJS 的实现不依赖于 JSXTransformer / babel。我们也可以在没有这两个的情况下使用 ReactJS,但对于 ReactJS,我仍然想要这个。

0 投票
3 回答
4996 浏览

javascript - React:将数组绑定到动态添加的字段

假设我有一个带有状态级数组的类

这个想法是我可以动态添加到元素数组并出现一个新的输入字段。

如何绑定数据,以便能够更改输入字段中的值并使其自动反映在元素数组中的正确元素中?

0 投票
1 回答
3666 浏览

reactjs - React Router 将 IndexRoute 重定向到正确的路径

我正在尝试配置 React Router,以便在访问 http://url/manage/roomId 时直接访问 http://url/manage/roomId/sessions(加载 RoomSessions 组件)。这些是选项卡组件的路由,我想默认使用正确的 URL(它没有)加载第一个选项卡的内容(它会这样做)。

它工作正常,除了重定向

我错过了什么?

0 投票
0 回答
35 浏览

reactjs - 使用 webpack 和 eslint 在 jsx 中获取 SyntaxError

index.js

webpack.web.js

.eslintrc

package.json

当我跑步时,npm run dev:web 我得到了SyntaxError

我对此一无所知......

0 投票
1 回答
459 浏览

reactjs - JSX/React - 附加 ListView 项目

仍然围绕着反应及其神秘的方式缠绕我的头。在 jQuery + HTML 中,可能有一个元素,该元素<ListView> </ListView>稍后会由生成<Item>s 的 for 循环填充。同样在角度上,您只需 ng-repeat。

这样做的反应方式是什么?我以前有这个工作,当我有一个<ListView items={listItems}></ListView>listItems 在其他地方定义为listItems = {heading:"qwerty", label:"test"}etc 但现在当我检查执行代码时,我看到每个<Item>创建的都是一个“ReactElement”类型,因此不支持使用该行为。

任何想法将不胜感激!谢谢。

更新代码:

0 投票
1 回答
3880 浏览

javascript - 在 React 渲染函数中使用 jQuery

我有以下反应渲染功能:

我想让 h2 标题基于 body 类,所以我的问题是......我可以这样做吗?

如果这是一个糟糕的主意,有人能告诉我在 React 中什么是更好的方法吗?