Блог

Проблема проявляется в Mac OS, и она хорошо работает в Windows.

Это демо. При нажатии кнопки количество count не увеличилось, по-прежнему 0. Но при просмотре состояния в react dev-tool количество значений состояния действительно увеличивалось при нажатии кнопки. А reducer — это чистая функция, при изменении состояния она просто генерирует новый объект.

Ниже приведен код:

 import React, { Component } from 'react'
import ReactDOM from 'react-dom'
import { createStore } from 'redux'
import { Provider, connect } from 'react-redux'

// React component
class Counter extends Component {
  render() {
    const { value, onIncreaseClick } = this.props
    return (
      <div>
        <span>{value}</span>
        <button onClick={onIncreaseClick}>Increase</button>
      </div>
    )
  }
}

// Action
const increaseAction = { type: 'increase' }

// Reducer
function counter(state = { count: 0 }, action) {
  const count = state.count
  switch (action.type) {
    case 'increase':
      return { count: count   1 }
    default:
      return state
  }
}

// Store
const store = createStore(counter)

// Map Redux state to component props
function mapStateToProps(state) {
  return {
    value: state.count
  }
}

// Map Redux actions to component props
function mapDispatchToProps(dispatch) {
  return {
    onIncreaseClick: () => dispatch(increaseAction)
  }
}

// Connected Component
const App = connect(
  mapStateToProps,
  mapDispatchToProps
)(Counter)

ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>,
  document.getElementById('root')
)
  

Я думаю, что это просто в коде. Но я не могу сказать, почему. Проблема возникает только в Mac OS, как в Chrome, так и в Safari.

Кто-нибудь может мне помочь?

этот код работает отлично. Я думаю, что должны быть некоторые проблемы с javascript, которые мешают коду работать, причиной могут быть другие файлы вашего проекта. Пожалуйста, проверьте это, или вы можете поделиться кодом своего проекта.