material-ui

问题 I start to study material-ui and create a simple app in the SandBox: https://codesandbox.io/s/eager-ride-cmkrc The style of jss is unusual for me, but if you help me with these two simple exercises, then I will understand everything. First: I want union common properties of ButtonLeft and ButtonRight into new class and extend it: (https://github.com/cssinjs/jss-extend#use-rule-name-from-the-current-styles-object) ButtonControll: { display: "none", position: "absolute", fontSize: "24px" },

问题 There are 20 cards on the page. MaterialUI Card has onExpandChange property where I can define an action like this: <Card expandable={true} onExpandChange={this.clickHandle}> In this action I can easily know if the clicked card is expanded or not, because the callback function is defined like this in the MaterialUI: function(newExpandedState: boolean) => void clickHandle = (newExpandedState: boolean) => { //do something } Now I would like to change card's class, for example, give it class

问题 Can anyone tell me how to make text field with label in material-ui lib looking for something like this : https://github.com/callemall/material-ui/blob/master/src/TextField/TextFieldLabel.jsx but cant find it in the npm package 回答1: For a fixed label, you need to set the floatingLabelFixed prop: <TextField floatingLabelText="Fixed Floating Label Text" floatingLabelFixed={true} /> For more info, see 'Simple examples' in the docs for Textfield. 来源： https://stackoverflow.com/questions/34996388

问题 Iv defined an app bar using material-ui (app-bar-docs), and it includes a children attribute which can be used to add content to it (the docs mention things like tabs can be added to the appbar). However, i want to have a text input inside the Appbar, but it ends up to the right, after an iconelementright , how do i get it back to the center? here is the code: class AppBarExampleIconButton extends React.Component { render() { return ( <AppBar title={<span style={styles.title}>Title</span>}

问题 So I had a problem in my React application, I ran into a specific case where I needed to have multiple setState() calls in one method, and then have code run AFTER the states were set. The code below is a Dialog box used to add an account on the website. import React from 'react'; import Dialog from 'material-ui/Dialog'; import FlatButton from 'material-ui/FlatButton'; import TextField from 'material-ui/TextField'; /** * A modal dialog can only be closed by selecting one of the actions. */

问题 I have a react app and I am trying to convert it from bootstrap to Matrial-UI but when I try to change the modal from bootstrap to material-ui the form does not work. I have not used material-ui before so I am a bit lost This is my bootstrap <LocalForm className="container" onSubmit={(values)=>this.handleComment(values)}> <Grid md={12}> <Label htmlFor="name">Your Name</Label> <Control.text model=".name" id="name" name="name" className="form-control" placeholder="Your Name"validators={{

问题 I am using Dialog components from material-ui ReactJs. <Dialog fullScreen open={this.state.open} PaperProps={{ classes: {root: classes.dialogPaper} }} onClose={this.handleClose.bind(this)} transition={this.props.transition}> {this.props.children} </Dialog> In the above code I already override the root classes of PaperProps. Now I also want to override the style in the PaperProps. Is that possible in the PaperProps to override the styles. Something like PaperProps={{ classes: {root: classes

问题 I am trying to make a script centered around changing the material via a drop-down menu and the texture via a slider. I am having some difficulty applying to a model. How can I change my script to fit this requirement? import maya.cmds as mc if mc.window("ram", exists =True): mc.deleteUI(ram) ram = mc.window("Material and Texture",t = "Material and Texture v0.9", w=300, h=300) mc.columnLayout(adj = True) imagePath = mc.internalVar(upd = True)+"icons/scriptlogo.jpg" mc.image(w=300,h=200,image

问题 I am creating a react form with material-ui. I would like the form to be a fixed 2 column view and not flow based on the browser size so it is always like this: |First Name |Last Name| |Street Address |City | And not end up like |First Name |Last Name| Street Address |City | https://codesandbox.io/s/0q7kw76nyl import React from "react"; import PropTypes from "prop-types"; import { withStyles } from "@material-ui/core/styles"; import TextField from "@material-ui/core/TextField"; const styles =

问题 I have an issue working with the material UI RadioGroup in combination with FormControlLabels returned by a component. Currently I try this: <FormControl component="fieldset"> <RadioGroup row name="genreSelection" className="genre-wrapper" value={this.state.selection} onChange={this.handleRadioSelection} > { this.state.genres.map(genre => ( <GenreItem key={genre} label={genre} radioButton/> )) } </RadioGroup> </FormControl> And the render function of GenreItem looks like this: if (this.props