Javascript - React - 返回多个值

Question

在我的 React 组件中，我有以下方法来保持状态和道具同步：

    static getDerivedStateFromProps(nextProps, prevState) {
        return nextProps.filterName === prevState.filterName ? '' : { filterName: nextProps.filterName };
    }

这是有效且有效的，但我还想在同一方法中添加第二行来更新另一个状态属性：

   return nextProps.saveChecked === prevState.saveChecked ? false : { saveChecked: nextProps.saveChecked };

如果我将 filterName 的现有 return 语句替换为 saveChecked 的这个语句，它就可以工作。添加无效的两个“返回”语句时出现错误。有没有一种有效的方法来重写它，以便可以更新两个状态属性？

Answer 1

您可以在单独的对象中创建一个 newState，然后立即返回它；

 static getDerivedStateFromProps(nextProps, prevState) {
    const newState = {}; 
    if(nextProps.filterName !== prevState.filterName) { 
        newState =  {...newState, filterName: nextProps.filterName };
    }
    if(nextProps.saveChecked !== prevState.saveChecked) {
        newState = {...newState, saveChecked: nextProps.saveChecked }
    }
    //check if the object is not empty
    if(!(Object.keys(obj).length === 0 && obj.constructor === Object)) {
        return newState;
    }
    return null

 }