解构内的解构答案

【问题标题】：Destructuring inside destructuring解构内的解构
【发布时间】：2020-08-31 16:42:01
【问题描述】：

我正在使用 React 功能组件，并且在该功能组件的参数中，我们正在使用解构。此外，我们正在做匹配：{params}，但我无法获得那部分。谁能解释一下！

const Deal = ({ history, form, match: { params } }) => {
     let isLoading = useSelector(getSelectedDealLoading);
     let err = useSelector(getSelectedDealError);
     const isSubmitSuccess = useSelector(getSuccess);
     const [isSubmitted, changeIsSubmitted] = useState(false);
    }

【问题讨论】：

同(props) => { const history = props.history, form = props.form, params = props.match.params; ... }
这能回答你的问题吗？ Destructuring Nested objects in javascript | Destructure second level parent and child Objects
明白了，基本上你的意思是我们正在解构匹配并且只获取可能具有 mor 属性的参数！？
是的，您将无权访问match 所写的任何其他属性。
酷，明白，感谢您的帮助@jonrsharpe

标签： javascript

【解决方案1】：

const objectToDestructure = {
  history: 'historyValue',
  form: 'formValue',
  match: {
    params: {
      param1: 'param1Value',
      param2: 'param2Value',
    }
  }
};

const { history, form, match: { params } } = objectToDestructure;

console.log({ history, form, params });

如果你的函数参数有我sn-p中对象的结构，它应该可以工作！

【讨论】：

那么，在这种情况下 match 可能除了 params 之外还有多个属性，但我们只考虑 params，这有意义吗？
没错！我们只是从匹配中解构参数，没有别的。如果您需要的不仅仅是参数，只需将其添加到表达式中，如下所示：const { history, form, match: { params, value2, value3 } } = objectToDestructure;
在我的示例中，params 将是 params 的任何值，而 value2 将是 undefined。
但是为什么我们使用变量参数来访问那个值为什么不匹配呢？
只是语法糖。您可以在整个代码中使用params.foo 而不是match.params.foo 等。使其更具可读性。