score:0

Accepted answer

i basically passed item.checked as item to my editor component and used it like so

  ...
  render() {
    const {item, value, onedit, onvalueclick, isediting, oncheck, ...props} = this.props
...

then in my editor.jsx i did the following

/components/editor.jsx

  rendervalue = () => {
    const ondelete = this.props.ondelete
    const oncheck = this.props.oncheck
    const itemchecked = this.props.item
    const ischecked = {textdecoration: itemchecked ? 'line-through' : 'none'} 

    return (
      <div>
        {oncheck ? this.rendercheckitem() : null}
        <div onclick={this.props.onvalueclick}>
          <span style={ischecked} classname='value'>{this.props.value}</span>
          {ondelete && this.renderdelete()}
        </div>
      </div>
    )
  }

  rendercheckitem = () => {
    return (
      <input 
        type="checkbox"
        classname='check-item'
        defaultchecked={false}
        onclick={this.props.oncheck}
      />
    )
  }

/components/items.jsx

export default class items extends react.component {
  render () {
    ...

    return (
      <ul classname='items'>{items.map((item) =>
        <item
          classname='item'
          key={item.id}
          id={item.id}>
          <editor
            item={item.checked}
            isediting={item.isediting}
            ...

score:1

you need to connect your components to the redux store. here's how to do it. in short you need something like:

export default connect(
  state => {
    return {items: state.items};
}
)(items);

where connect comes from react-redux.


Related Query

More Query from same tag