Question

我想将我的代码整理到components和containers文件夹结构中。我将使用Redux与动作和减速器。

您认为StartButton是组件还是容器？它不会连接到redux存储，但它有自己的状态和一些决策逻辑，所以也许它不是那么愚蠢......

我知道我的问题与意见有关，但也许有人可以向我提供一些见解以及被视为最佳做法。

这是我的StartButton组件：

import React, { Component } from 'react';
import RaisedButton from 'material-ui/RaisedButton';

import './style.css';

class StartButton extends Component {
  constructor() {
    super();

    this.state = {
      startWasClicked: false,
    };
  }

  handleStartButton = () => {
    this.setState({ startWasClicked: true });
  };

  beerListingView() {
    if (this.state.startWasClicked) {
      return <div>YES! It was clicked!</div>;
    }
    // Else return just single <div />
    return <div />;
  }

  render() {
    return (
      <div>
        <div className="StartButton-container">
          <RaisedButton
            label="Start Here"
            className="StartButton-main"
            onClick={this.handleStartButton}
          />
        </div>
        {this.beerListingView()}
      </div>
    );
  }
}

export default StartButton;

Answer 1

在我的应用中，containers指的是连接到Redux商店的反应组件。

components是其他所有人。例如，他们中的大多数都使用React状态来切换UI内容。这完全没问题。

查看https://github.com/react-boilerplate/react-boilerplate例如

与redux和组件对容器困境发生反应

1 个答案: