问题标签 [material-ui]

我对开始学习 Angular 2.0 和 TypeScript 非常感兴趣。我遇到了一个漂亮的 Material Design Library Material-UI，并注意到它在distinctlyTyped（定义 repo）中有一个 TypeScript 定义。

如何将这个库和定义文件与 Angular 2.0 的语法一起使用？我似乎在任何地方都找不到关于这两者的指南或博客文章。

谢谢！

我正在使用material-ui创建一个表单。

我可以在同一行显示两个 SelectFields：

或两行：

但是，以下代码会产生两行：

如何在同一行显示两个 DatePickers（不使用 minDate 和 maxDate）？

我已经下载了“material-ui”包并通过 NPM 添加到我的 package.json 文件中。它显示在我的package.json文件中。但是，我无法访问组件，就像AppBar我的浏览器告诉我它没有定义一样。我试图在我的 application.js 文件中添加一个全局变量，但这实际上会使应用程序崩溃：

var MaterialUI = require('material-ui');

我正在使用带有 Browserify 的 Rails 4 和 Ruby 2.1。绝对令人沮丧，我只是无法弄清楚我做错了什么。感谢您给我的正确方向的任何帮助/指示！

我在我的项目中使用 React Material-UI。我在渲染方法中放置了许多组件。然后奇怪的事情发生了。'this.refs.REFNAME' 不能引用某些组件。然后我检查了“this.refs”对象，如下图所示：

如您所见，第一行仅显示了一些可以引用的组件。我不明白为什么。谁能给我解释一下？非常感谢。

更新：感谢詹姆斯，我知道第一行应该是那个时候“this.refs”的状态。但是，为什么有些组件不在 refs 对象中？

这是代码的相关部分：

我想用这段代码做的是在一个带有播放器列表的表中生成行，当我点击一行时，会显示一个包含该行数据的对话框。

但是不能引用引用为“txtName”和“txtNotes”的两个“TextField”（如最后两行，产生错误）。上图由 '_onShowInfo' 方法中的 'console.log' 生成。我添加了一些带有随机名称的 'ref' 只是为了测试。

我正在尝试通过在单击时使用 material-ui 获取文本字段中的值来更新我的状态。但是，似乎 setState 在这里更新 todo 状态总是落后一步。例如，如果我第一次输入“asdf”，this.state.todo则为空（这是它被初始化的内容）。然后我输入“1234”。点击后，我现在看到那this.state.todo是'asdf'！

问题 1：我认为这可能与 setState 的“未决状态转换”有关，但不知道如何解决。

当我将 onChange 和 value 与 vanilla (non-material-ui) 输入字段一起使用时，一切正常。

问题2：所以我也很好奇为什么setState 在material-ui getValue() 的情况下批处理了这个过程，但是当我在输入中使用onChange/Value 时却没有。

以下是这两个品种的代码。

Material-UI 文本字段：

香草输入

material-ui TextField 的控制台输出

Material UI是一组 React 组件，它以迄今为止我所见过的最好的方式实现了 Google 的 Material Design。

现在我有一个项目，很遗憾我无法使用 React.js。但我想使用项目包含的出色 CSS。

有没有办法将样式嵌入到我现有的项目中？

我正在将 React 与 Redux 和 Material UI 一起使用来构建 web 应用程序。webapp 由多个页面和组件组成。我知道快餐栏或对话框应该直接连接到用户正在做的事情。但是，我想让快餐栏和对话框独立于页面和组件。因此，一个用例正在显示一条消息 likebackground synchronization of your data failed和一个 action retry now。我的想法是在一个名为 的页面上呈现snackbar，该页面RootFrame用于包装所有其他页面并将snackbar 的文本作为操作的有效负载发送。

我的 Redux 操作来显示一个小吃吧：

当然，在操作中指定消息而不是将消息作为参数也可能会很好，但这不是我现在的问题。问题是：我怎样才能使用这个系统并显示一个带有动作的snackbar？我可以将我的操作更改为

RootFrame并以类似的方式渲染我的小吃店

当快餐栏被关闭时，一个动作会改变状态中的一个变量：snackbar.visible = false。这用于激活快餐栏（它在 时呈现snackbar.visible === true）。当用户点击 时retry now，启动同步的动作（作为道具传递给组件）应该被调度。使用对话框时问题非常相似。因此，不仅要显示的文本，而且下一个可能的操作都必须传递给组件。

你认为像这样使用 Redux 是可以的还是有更好的解决方案？

我正在使用 material-ui 作为 UI 框架，我正在尝试创建一个包含两个具有不同值的按钮的视图。

由于我是新来的反应，我认为我错过了一些基本的东西。如何将值传递给 FlatButton，我可以使用“ref”属性吗？我的主要问题是我正在使用一个框架。如果我编写了这些组件，我将只使用道具，例如“标签”并处理来自组件本身的点击事件。

更新：找到了解决方案，但仍然感觉像是一种反模式......

感谢帮助...

我正在使用 Material UI 创建一个简单的图标下拉菜单。但是在渲染后出现字形MenuItems，点击它后没有显示。这是代码 -

这是一个初学者 React.js / ES2015 问题。

我有一些显示书名列表的 HTML：

当用户编辑一个名字并按下回车键时，我会在我的类中调用一个方法来检查这本书是否存在并更新我的商店：

问题是：在这种方法中，我如何访问类（this.doesBookExistElseShowMessage）和调用对象（this.defaultValue）？

这是调用对象（TextField，目前是），或者我可以在类构造函数中将它绑定到类

但后来我失去了对 TextField 的访问权限。我看不到任何方法可以在方法中获取对这两个对象的引用。