Question

我在让子组件更新新道具时遇到问题。我正在从全局状态中删除一个项目，并且成功。但是，当该项目被删除时，我希望该项目不再显示。它仍在显示，但是如果我要移到另一个屏幕然后返回，它就消失了。对我可能在这里缺少的东西有任何想法吗？

谢谢！

export default class Summary extends Component {
  constructor(props) {
    super(props);

    this.state = {
      pickupData: this.props.pickup
    };
  }

  handleDelete(item) {
    this.props.deleteLocationItem(item);
  }

  render() {
    const pickup = this.state.pickup;

    return (
      <View>
        {pickup.map((item, i) => (
          <LocationItem
            name={item}
            onPressDelete={() => this.handleDelete(item)}
          />
        ))}
      </View>
    );
  }
}

const LocationItem = ({ onPressDelete, name }) => (
  <TouchableOpacity onPress={onPressDelete}>
    <Text>Hi, {name}, CLICK ME TO DELETE</Text>
  </TouchableOpacity>
);

-------附加信息------

case 'DELETE_LOCATION_INFO':
  return Object.assign({}, state, {
  pickup: state.pickup.filter(item => item !== action.action)
})

export function deleteLocationInfo(x){
  return {
    type: DELETE_LOCATION_INFO,
    action: x
  }
}

Answer 1

您的deleteLocationItem必须是这样的：

render (

const { pickup } = this.props;
return(
  <View>
    { pickup.map
...

然后在您的Summary类中，您无需再次设置道具。只需从这样的道具中领取道具即可：

 stage('sysdig report'){
    publishHTML(target: [
        allowMissing         : true,
        alwaysLinkToLastBuild: false,
        keepAll              : true,
        reportDir            : "${workspace}/",
        reportFiles          : "sysdig-report.html",
        reportName           : "sysdig-report"
    ])

Answer 2

基于除构造函数中未更新的状态进行渲染。当prop从父对象更新时，它不会反映在状态中。添加componentWillReceiveProps方法以接收新道具并更新状态，这将导致呈现新数据

但更可取的是，如果初始化后状态没有任何改变，请直接使用prop本身进行渲染，以解决此问题

子组件未使用新道具进行更新

2 个答案: