Material-ui: ๋™์ผํ•œ ์Šคํƒ€์ผ ๊ฐ์ฒด์— ๋Œ€ํ•ด ๋‘ ๋ฒˆ ์ด์ƒ prepareStyles()๋ฅผ ํ˜ธ์ถœํ•  ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค.

์— ๋งŒ๋“  2016๋…„ 05์›” 06์ผ  ยท  3์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: mui-org/material-ui

"2 ๊ฒฝ๊ณ : ๋™์ผํ•œ ์Šคํƒ€์ผ ๊ฐœ์ฒด์—์„œ prepareStyles()๋ฅผ ๋‘ ๋ฒˆ ์ด์ƒ ํ˜ธ์ถœํ•  ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค."๊ฐ€ ํ‘œ์‹œ๋ฉ๋‹ˆ๋‹ค. ์•„๋ž˜ ์ฝ”๋“œ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ Avatar ๊ตฌ์„ฑ ์š”์†Œ์—:

<Card className="blabla"
       style={mystyle}>
    <CardMedia>
        <Avatar src={myPictureUrl}/>
    </CardMedia>
    <!-- ... -->
</Card>

๋ฒ„์ „:

  • ์žฌ๋ฃŒ UI: 0.14.4
  • ๋ฐ˜์‘: 0.14.8
  • ํฌ๋กฌ: 50.0.2661.75

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

์—ฌ์ „ํžˆ ์ด ๋ฌธ์ œ๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค.

  • ์žฌ๋ฃŒ UI: 0.17.1
  • ๋ฐ˜์‘: 15.4.2
  • ํฌ๋กฌ: 57.0.2987.133(64๋น„ํŠธ)

์ž„์‹œ ํ•ด๊ฒฐ

<Card className="blabla" style={mystyle}>
    <CardMedia>
        <div>
             <Avatar src={myPictureUrl}/>
        </div>
    </CardMedia>
    <!-- ... -->
</Card>

๋ชจ๋“  3 ๋Œ“๊ธ€

์˜ค๋ž˜๋œ ๋ฒ„์ „, ์ด๊ฒƒ์€ ์ˆ˜์ •๋˜์—ˆ์Šต๋‹ˆ๋‹ค

์—ฌ์ „ํžˆ ์ด ๋ฌธ์ œ๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค.

  • ์žฌ๋ฃŒ UI: 0.17.1
  • ๋ฐ˜์‘: 15.4.2
  • ํฌ๋กฌ: 57.0.2987.133(64๋น„ํŠธ)

์ž„์‹œ ํ•ด๊ฒฐ

<Card className="blabla" style={mystyle}>
    <CardMedia>
        <div>
             <Avatar src={myPictureUrl}/>
        </div>
    </CardMedia>
    <!-- ... -->
</Card>

0.18.1 ์—๋Š” ์—ฌ์ „ํžˆ ๋ฌธ์ œ๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค. ํฌํ•จํ•˜๋Š” svg ์•„์ด์ฝ˜์„ ์•„๋ž˜ ์ฝ”๋“œ์— ์ถ”๊ฐ€ํ•˜๋ฉด ์ด ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค.

        <CardMedia
          overlay={
            <CardTitle
              title={this.props.device.label}
              subtitle={`Created ${moment(this.props.device.created).fromNow()}`}
            />
          }
          overlayContentStyle={{background: background}}
        >
          <img src={this.chooseImage(this.props.device.label)} alt="" />
        <CheckIcon />
        </CardMedia>

div์—์„œ ์š”์†Œ๋ฅผ ๋ž˜ํ•‘ํ•˜๋Š” nndung179์˜ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์ด ์ž‘๋™ํ•ฉ๋‹ˆ๋‹ค.

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰