打印-连接组件'；在使用redux和规范化redux存储时使用s包装器

使用React性能工具和normalize store redux时，连接组件的包装器得到了打印（在printWasted中）

截图： 当handle onClick在

Comment

组件中编辑文本时会发生这种情况

我的redux商店：

{
  currentPosts: ["123", "321"],
  entities: {
    articles: {
      "123": {
        id: "123",
        author: ["1"],
        title: "My awesome blog posts",
        comments: ["234"]
      },
      "321": {
        id: "321",
        author: ["2"],
        title: "My second awesome blog posts",
        comments: ["456"]
      }
    },
    users: {
      "1": {
        id: "1",
        name: "Paul"
      },
      "2": {
        id: "2",
        name: "Nicole"
      },
      "3": {
        id: "3",
        name: "Roy"
      },
      "4": {
        id: "4",
        name: "Peth"
      }
    },
    comments: {
      "234": {
        id: "234",
        commenter: ["3"],
        text: "This is comment 234"
      },
      "456": {
        id: "456",
        commenter: ["4"],
        text: "This is comment 456"
      }
    }
  }
}

减速器：

const rootReducer = combineReducers({
  entities,
  currentPosts
})

const entities = combineReducers({
  articles,
  users,
  comments
})

const articles = (state = {}, action) => {
  return state
}

const users = (state = {}, action) => {
  return state
}

const comments = (state = {}, action) => {
  switch (action.type) {
    case 'EDIT_COMMENT':
      return Object.assign({}, state, {
        [action.id]: Object.assign({}, state[action.id], {
          text: action.comment
        })
      })
    default:
      return state
  }
}

行动：

export const editComment = (id) => {
  return {
    id,
    type: 'EDIT_COMMENT',
    comment: `Edited comment ${id}`,
  }
}

组件（由4分隔）：

容器：

import React from 'react'
import { connect } from 'react-redux'
import Article from './Article'

const Container = ({ currentPosts }) => (
  <div>
    {currentPosts.map((val, i) =>
      <Article
        key={i}
        titleKey={val} />
    )}
  </div>
)

const mapStateToProps = (state) => ({
  currentPosts: state.currentPosts
})

export default connect(mapStateToProps)(Container)

从“React”导入React
从“react redux”导入{connect}
从“./Article”导入项目
常量容器=（{currentPosts}）=>(
{currentPosts.map（（val，i）=>
)}
)
常量mapStateToProps=（状态）=>({
currentPosts:state.currentPosts
})
导出默认连接（MapStateTops）（容器）

第条：

import React from 'react'
import { connect } from 'react-redux'
import Creator from './Creator'
import Comment from './Comment'

const Article = ({ articles, titleKey }) => {
  const article = articles[titleKey]
  return (
    <div style={{marginBottom: '10px'}}>
      title: {article.title}
      {article.author.map((val, i) =>
        <Creator
          label="author"
          key={i}
          authorKey={val} />
      )}
      {article.comments.map((val, i) => {
        return (
          <Comment
            key={i}
            commentKey={val} />
        )
      }
      )}
    </div>
  )
}

const mapStateToProps = (state) => ({
  articles: state.entities.articles
})

export default connect(mapStateToProps)(Article)

从“React”导入React
从“react redux”导入{connect}
从“./Creator”导入创建者
从“./Comment”导入注释
常量项目=（{articles，titleKey}）=>{
const article=文章[标题键]
返回(
标题：{article.title}
{article.author.map（（val，i）=>
)}
{article.comments.map（（val，i）=>{
返回(
)
}
)}
)
}
常量mapStateToProps=（状态）=>({
条款：国家、实体、条款
})
导出默认连接（MapStateTops）（文章）

评论：

import React from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import Creator from './Creator'
import { editComment } from './actions'
import Perf from 'react-addons-perf'
window.Perf = Perf

class Comment extends React.Component {
  constructor(props) {
    super(props)
    this.handleEditComment = this.handleEditComment.bind(this)
  }

  handleEditComment() {
    const comment = this.props.comments[this.props.commentKey]
    Perf.start()
    this.props.actions.editComment(comment.id)
  }

  shouldComponentUpdate(nextProps) {
    if (this.props.comments[this.props.commentKey].text !== nextProps.comments[nextProps.commentKey].text) {
      return true
    }
    return false
  }

  componentDidUpdate() {
    Perf.stop()
    Perf.printWasted()
  }

  render() {
    const comment = this.props.comments[this.props.commentKey]

    return (
      <div>
        comment {comment.text}
        {comment.commenter.map((val, i) =>
          <Creator
            label="commenter"
            key={i}
            authorKey={val} />
        )}
        <button onClick={this.handleEditComment}>Edit Comment</button>
      </div>
    )
  }
}

const mapStateToProps = (state) => ({
  comments: state.entities.comments
})

const mapDispatchToProps = dispatch => ({
  actions: bindActionCreators({ editComment }, dispatch)
})

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(Comment)

从“React”导入React
从“react redux”导入{connect}
从“redux”导入{bindActionCreators}
从“./Creator”导入创建者
从“/actions”导入{editComment}
从“react addons Perf”导入性能
window.Perf=Perf
类注释扩展了React.Component{
建造师（道具）{
超级（道具）
this.handleeditcoment=this.handleeditcoment.bind（this）
}
handleEditComment（）{
const comment=this.props.comments[this.props.commentKey]
性能启动（）
this.props.actions.editComment（comment.id）
}
应更新组件（下一步）{
if（this.props.comments[this.props.commentKey].text！==nextrops.commentKey[nextrops.commentKey].text）{
返回真值
}
返回错误
}
componentDidUpdate（）{
性能停止（）
性能
}
render（）{
const comment=this.props.comments[this.props.commentKey]
返回(
注释{comment.text}
{comment.commenter.map（（val，i）=>
)}
编辑评论
)
}
}
常量mapStateToProps=（状态）=>({
注释：state.entities.comments
})
const mapDispatchToProps=调度=>({
操作：bindActionCreators（{editComment}，dispatch）
})
导出默认连接(
MapStateTops，
mapDispatchToProps
)（评论）

创造者

import React from 'react'
import { connect } from 'react-redux'

const Creator = ({ users, authorKey, label }) => {
  const user = users[authorKey]
  return (
    <div>
      {label}: {user.name}
    </div>
  )
}

const mapStateToProps = (state) => ({
  users: state.entities.users
})

export default connect(mapStateToProps)(Creator)

从“React”导入React
从“react redux”导入{connect}
const Creator=（{users，authorKey，label}）=>{
const user=用户[授权]
返回(
{label}:{user.name}
)
}
常量mapStateToProps=（状态）=>({
用户：state.entities.users
})
导出默认连接（MapStateTops）（创建者）

---

这是否可能删除已连接组件的包装，或者我是否误解了redux和规范化redux存储？

我在github问题中询问，并在这里解决它