stampit-org / react-stamp

Composables for React.
370 stars 10 forks source link

Why `behavior` destructuring #25

Closed amelon closed 8 years ago

amelon commented 8 years ago

In your exemple, you're using rest+spread on behavior object.

import reactStamp from 'react-stamp';

export default ({
  React,
  Button,
  Text,
}, ...behaviors) => (
  reactStamp(React).compose({
    state: {
      showText: false,
      clickable: false
    },

    render () {
      const { clickable, showText } = this.state;
      const { text } = this.props;

      return (
        <div>
          <Button
            disabled={!clickable}
            onClick={() => this.onClick && this.onClick()}
            value='click me'
          />
          <Text
            value={showText && text}
          />
        </div>
      );
    }
  }, ...behaviors)
);

But as fas as I understand react-stamp composition, it should be possible to just send behavior.

import reactStamp from 'react-stamp';

export default ({
  React,
  Button,
  Text,
}, behaviors) => (
  reactStamp(React).compose({
    state: {
      showText: false,
      clickable: false
    },

    render () {
      const { clickable, showText } = this.state;
      const { text } = this.props;

      return (
        <div>
          <Button
            disabled={!clickable}
            onClick={() => this.onClick && this.onClick()}
            value='click me'
          />
          <Text
            value={showText && text}
          />
        </div>
      );
    }
  }, behaviors)
);

Did I miss something?

troutowicz commented 8 years ago

In the example, rest/spread is not needed. However, they are needed when there are multiple behaviors. The behavior object represents all passed in component behaviors. If it helps, think of behavior as a POJO:

const behaviors = { behavior1, behavior2 };

The compose method takes N number of objects:

reactStamp(React).compose(container, behavior1, behavior2);

It the rest/spread operators are not used, the compose method would not work correctly when multiple behaviors are passed.

reactStamp(React).compose(container, { behavior1, behavior2 });
amelon commented 8 years ago

very clear, thank you for your answer.