react怎么写行内样式？下面本篇文章给大家介绍一下react 行内样式几种写法。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。

react 行内样式几种写法

法一

<h1 style={{color:'red',fontSize:'30px'}}>这是评论列表组件1</h1>

法二

const title={color:"red",fontSize:'30px',fontWeight:'400',textAlign:'center'},
<h1 style={{title}}>这是评论列表组件1</h1>

法三

将数据合并到一个对象中定义，也可以如下面这样抽离出去

import React from 'react'
import CmtItem from '@/components/CmtItem'

import styles from '@/components/csslist.js'
 export default class Cmtlist extends React.Component{
  constructor(){
    super()
    this.state={
      CommentList:[
        {id:1,user:'张三1',content:'格外'},
        {id:2,user:'南方2',content:'的'},
        {id:3,user:'车站3',content:'寒冷'},
        {id:4,user:'的雪4',content:'哈哈哈'},
        {id:5,user:'嗝的5',content:'哈哈哈'}
      ]
    }
  }
  render(){
    return <div>
      <h1 style={styles.title}>这是评论列表组件1</h1>
      {this.state.CommentList.map(item=><CmtItem {...item} key={item.id}></CmtItem>)}
    </div>
  }
}//页面csslist.js

更多web前端知识，请查阅 HTML中文网 ！！