안뇽하세요 강사님

Question

다름이아니라 react bootstrap에서 이제 Media를 지원하지 않는거같은데 어떤걸로 대체하면 좋을까 알 수 있을까요?   React-Bootstrap &middot; React-Bootstrap Documentation

wjdtjrdn65096 · Answer

감사합니다~~

John Ahn · Answer

안녕하세요 !!! Media가 없어진걸 알려주셔서 너무 감사합니다 !!! 우선 Media가 쓰인곳이 Message.js와 MessageHeader.js 두곳이네요 ! 먼저 Message.js에서는 < div style = {{ marginBottom : ' 3px ' , display : ' flex ' }} > < img style = {{ borderRadius : ' 10px ' }} width = { 48 } height = { 48 } className = " mr-3 " src = { message . user . image } alt = { message . user . name } /> < div style = {{ backgroundColor : isMessageMine (message , user) && " #ECECEC " }} > < h6 >{ message . user . name }{ " " } < span style = {{ fontSize : ' 10px ' , color : ' gray ' }} > { timeFromNow (message . timestamp) } { isImage (message) ? < img style = {{ maxWidth : ' 300px ' }} alt = " 이미지 " src = { message . image } /> : < p > { message . content } } 이렇게 바꿔주세요 !!! 그리고 MessageHeader에서는 const renderUserPosts = ( userPosts ) => Object . entries (userPosts) . sort ( ( a , b ) => b[ 1 ] . count - a[ 1 ] . count) . map ( ([ key , val ], i ) => ( < div key = { i } style = {{ display : ' flex ' }} > < img style = {{ borderRadius : 25 }} width = { 48 } height = { 48 } className = " mr-3 " src = { val . image } alt = { val . name } /> < div > < h6 >{ key } < p > { val . count } 개 )) 이렇게 바꿔주시면 감사하겠습니다 ! Media를 div 태그로 바꿔주고 display:'flex' 스타일을 주었습니다 ! 감사합니다.