我想知道是否可以:

import React, { PureComponent } from "react";
import { Text, TouchableOpacity } from "react-native";
import { connect } from "react-redux";
import PropTypes from "prop-types";

class ListItem extends PureComponent {
  render() {
    return (
      <TouchableOpacity>
        <Text style={{ color: "red" }}>Some Text</Text>
        <TouchableOpacity />
      </TouchableOpacity>
    );
  }
}

export default connect()(ListItem);

并且可能不添加mapStateToProps()。还是这是一种反模式?我听说PureComponents会降低性能...

最佳答案

使用connect和PureComponent没有问题。如果 Prop 已更改,则PureComponent呈现,并且connect()将redux状态映射到 Prop 。参见redux团队的this example。我已经用Purecomponent替换了TodoList组件:

class TodoList extends React.PureComponent {
  render() {
    const { todos, toggleTodo } = this.props;
    return (
      <ul>
        {todos.map(todo => (
          <Todo key={todo.id} {...todo} onClick={() => toggleTodo(todo.id)} />
        ))}
      </ul>
    );
  }
}

/*
const TodoList = ({ todos, toggleTodo }) => (
  <ul>
    {todos.map(todo =>
      <Todo
        key={todo.id}
        {...todo}
        onClick={() => toggleTodo(todo.id)}
      />
    )}
  </ul>
)
*/

它的工作原理是一样的。

关于reactjs - 可以连接PureComponent吗?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/51423335/

10-10 15:26