小编dav*_*ien的帖子

我现在正在做一些React,我想知道是否有一种"正确"的方式来做条件样式.在他们使用的教程中

style={{
  textDecoration: completed ? 'line-through' : 'none'
}}

我不想使用内联样式,所以我想改为使用类来控制条件样式.如何以React的思维方式解决这个问题？或者我应该使用这种内联样式方式？

尽管我的状态成功更新(通过console.log和redux devtools检查)但我无法重新渲染我的视图

您可以在https://github.com/attendanceproject/djattendance/tree/attendance-redux/ap/static/react-gulp/app上查看代码

大多数代码都在scripts文件夹中,与我的问题有关的最重要的部分如下.每次在WeekBar组件中按下上一个或下一个按钮时,我都会尝试重新渲染,以便相应地更新日期.

容器代码

class Attendance extends Component {
  render() {
    const { dispatch, trainee, date, events, rolls, slips, selectedEvents } = this.props
    console.log('this.props', this.props)
    return (
      <div>
        <div>
        <Trainee trainee={trainee} />
        <WeekBar  
          date={date} 
          onPrevClick={date => dispatch(prevWeek(date))}
          onNextClick={date => dispatch(nextWeek(date))}/>
        </div>
        <hr />
      </div>
    )
  }
}

Attendance.propTypes = {
  trainee: PropTypes.shape({
    name: PropTypes.string,
    id: PropTypes.number,
    active: PropTypes.bool
  }).isRequired,
  date: PropTypes.object.isRequired,
  events: PropTypes.array.isRequired,
  rolls: PropTypes.array.isRequired,
  slips: PropTypes.array.isRequired,
  selectedEvents: PropTypes.array
}

function select(state) {
  return {
    trainee: state.trainee, …