Question

以下摘录摘自降档演示here：

<Downshift inputValue={inputValue} onChange={this.handleChange} selectedItem={selectedItem}>
        {({
          getInputProps,
          getItemProps,
          isOpen,
          inputValue: inputValue2,
          selectedItem: selectedItem2,
          highlightedIndex,
        }) => (

有人可以解释“inputValue：inputValue2”是什么意思吗？

Answer 1

当用于封闭{}时，：：分隔对象成员引用，其中值为＆quot; inputValue＆＃39;冒号左侧是成员引用，右侧是值＆quot; inputValue2＆＃39;是分配给该成员的变量或值。

例如：

    var test = "hello"
       ,obj = {a:1,b:2,c:test};

在上面的测试中分配值＆＃34; hello＆＃34;，在对象定义中它有3个成员，a，b和c，a分配1，b分配2，c分配变量测试

    alert(obj['c']);

将导致＆＃34;你好＆＃34;正在展示。

Answer 2

它是毁灭的一部分（滚动到＆＃34;分配给新的变量名称＆＃34;）https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

在您提供的示例中，我们不想隐藏变量selectedItem，因此他们已将其分配给selectedItem2。这样，您就可以使用您所在国家/地区定义的selectedItem，以及为该功能提供的function takeArguments({ firstArg, thirdArg, fourthArg: differentVariableName }){ console.log(firstArg, thirdArg, differentVariableName) } takeArguments({ firstArg: 1, thirdArg: 2, fourthArg: 3 });。

以下一个希望更简单的例子：

＆＃13;

gob2 = find_program('gob2')
patch_src = find_program('patch_src')

gen_src = custom_target('gen-output',
  output : ['gtk-image-viewer.h','gtk-image-viewer-private.h','gtk-image-viewer.c'],
  input : 'gtk-image-viewer.gob',
  command : [gob2, '-o', '@OUTDIR@', '@INPUT@'],
  )

fixed_src = custom_target('patch-output',
  output : ['gtk-image-viewer-fixed.c'],
  input : 'gtk-image-viewer.c',
  command : [patch_src, 'gtk-image-viewer.c','@OUTPUT@'],
  )

＆＃13;

Answer 3

这里inputValue：inputValue2表示inputValue是JSON键，inputValue2是要分配给此JSON键的变量。

 {
      getInputProps,
      getItemProps,
      isOpen,
      inputValue: inputValue2,
      selectedItem: selectedItem2,
      highlightedIndex,
    }

这个JSON可以写成

{
          getInputProps:getInputProps,
          getItemProps:getItemProps,
          isOpen:isOpen,
          inputValue: inputValue2,
          selectedItem: selectedItem2,
          highlightedIndex:highlightedIndex,
        }

如果key和assign变量具有相同的名称，则可以忽略在右侧写入变量名称。

Answer 4

所以代码

{
          getInputProps,
          getItemProps,
          isOpen,
          inputValue: inputValue2,
          selectedItem: selectedItem2,
          highlightedIndex,
}

是对象映射的简写语法。

在es6之前，如果你必须将数据从一个对象复制到另一个对象，你将不得不做这样的事情

var obj2;
obj2.firstProperty = firstProperty;
obj2.secondProperty = secondProperty;

（假设firstProperty和secondProperty已存在于范围内）现在在es6 你可以使用shortHand语法

obj2 = { firstProperty， secondProperty }

现在，当变量和对象的属性名称相同时，此方法有效。但是，如果你必须将对象中的“secondProperty”的属性名称更改为“second”，那么，你必须在对象中显式映射该属性。

obj2 = { firstProperty， second = secondProperty }

因此，在您的情况下，范围内有一个属性“inputValue2”，但您希望将对象中的该属性重命名为“inputValue”，这就是显式属性映射的语法。

那个“field1：field2”是什么意思？

4 个答案: