问题标签 [react-jsx]

我有一个ReactJS组件：

它似乎工作正常。但最初它不会在选择正确的项目时呈现。虽然defaultValue似乎设置正确，所以我不明白为什么。

我究竟做错了什么？

我有一个问题，关于由另一个组件组成的反应组件的最佳结构是什么。所以第一个是：

这里的问题是我无法从 ColorOption 访问 ColorSelect 函数

第二：

所以第一个是：

这里的问题是我无法从 ColorOption 访问 ColorSelect 函数

第二：

在这些示例中，组件不容易重用，因为我想要一个组件，我可以在其中以 json 格式发送属性

如您所料，我是 JS 的新手，尤其是 React 的新手。

我有一个变量list来保存我的计算。我有一个用于拖放和表单的处理程序，但是当数据更新时，react 仍然不知道这一点。

我应该使用一些特殊的命令来更新 this.props.data 还是更好的方法是在 React 组件中编写所有逻辑？

顺便说一句，list由runs[]. 每个run都有id和balls[]。ball有counter和value。_

我在 React 中的嵌套循环做错了什么？我在 Google 中搜索了信息，但没有找到合适的信息。你能帮我看看，我理解错了吗？

从图中可以看出，我在一个变量中有数据。它工作正常。但是当我添加一个不是来自 this 的值时<tr>，会出现错误！

错误（取决于从另一个添加的项目<tr>）：

未捕获的错误：不变违规：findComponentRoot(..., .0.1.1.0.2.0.0.1.$0.$9.$109): >无法找到元素。这可能意味着 DOM 发生了意外变异（例如，由 >browser），通常是由于在使用表时忘记了 a，n......`。

我有一个包含项目的数组，我想做这样的事情：

但是如果我这样做，我会收到一个 JSXTransformer 错误：

相邻的 XJS 元素必须包含在封闭标记中

工作版本：

我试过这个。但是使用<div>封闭标签它不能正常工作。

在这里回答： 未捕获的错误：不变违规：findComponentRoot(..., ...$110): Unable to find element。这可能意味着 DOM 发生了意外变异

请告诉我如何正确包装几个 TD 标签！ 我尝试使用指南Dynamic Children，但 JSXTransformer 不允许我这样做。

我正在为 Sublime/TextMate 语言文件中的某些语法高亮处理正则表达式，它要求我在非自结束 html 标记上“开始”，并在相应的结束标记上结束：

• 开始：(<)([a-zA-Z0-9:.]+)[^/>]*(>)

• 结尾： (</)(\2)([^>]*>)

到目前为止，一切顺利，我能够捕获标签名称，并且它匹配能够为标签之间的区域应用适当的模式。

现在，我还希望能够在开始标记中捕获零个或多个 html 属性，以便能够突出显示它们。

所以如果标签是<div attr="Something" data-attr="test" data-foo>

它将能够匹配attr, data-attr, and data-foo, 以及 the <anddiv

类似的东西（这很粗糙）：

(<)([a-zA-Z0-9:.]+)(?:\s(?:([0-9a-zA-Z_-]*=?))\s?)*)[^/>]*(>)

它不需要完美，它只是为了一些语法突出显示，但我很难弄清楚如何在标签中实现多个捕获组，我是否应该使用环视等，或者这是否是甚至可以用一个表达式。

编辑：这里有关于具体案例/问题的更多细节 - https://github.com/reactjs/sublime-react/issues/18

React Tools文档提到了一个命令行标志（-c，--config），可用于指定一个 JSON 配置文件，用于将 JSX 文件转换为 vanilla JS。我不确定这个配置文件可以指定什么以及它应该是什么样子。

我非常松散地遵循这里的示例，直到它开始运行开发服务器。

我有一个测试 React 组件（在 scripts/test.jsx 中）：

我有一个 webpack.config，我在其中对源目录使用 jsx 加载程序（它与示例中的基本相同，除了我添加了库属性）。

我运行 webpack 并像我期望的那样生成捆绑文件，但是，当我尝试在 html 文件中使用组件时（在包含 bundle.js 脚本参考之后），我在控制台中得到以下信息：“未捕获的 ReferenceError：测试不是定义“。

HTML 包含以下内容：

我是否在使用 CommonJS 样式中定义的组件对技术上不使用模块加载器的 html 页面做一些不正确的事情（我试图将此测试视为试图加载组件而没有任何结构化模块加载器的类型）？

webpack 的输出可在此处获得

编辑 2：完整的示例代码可作为 github repo获得

我正在创建一个传单地图组件，这是 plunker 上的一个示例

http://plnkr.co/edit/LkghwOcby49XESdGb782?p=preview

这是代码

传单.jsx

地图.html

我想尝试直接从浏览器控制台或页面上的任何脚本调用 modifyMap 方法。我曾尝试使用静态，但我无法找到包含 modifyMap 方法的对象。有没有一种简单的方法可以找到这种方法，或者有没有更好的方法来使用 Reactjs？我也知道，如果在此页面上创建 React 类而不是在单独的文件中使用 module.exports，这是可能的，我希望有另一种方法！请帮忙！

我的 React jsx 文件在浏览器内转换中运行良好。
但是在我安装 npm 并安装 react-tools 并使用 转换命令行后jsx -watch source/ build/，新转换的 JavaScript 文件看起来很好，但只会呈现不完整的 DOM 树。

我该如何解决？