为什么const名称需要在ReactJS中用大括号括起来

时间:2016-10-24 10:05:03

标签: javascript reactjs ecmascript-6

render () {
  const { params } = this.props.params
  return (
   <div>{ params.article }</div>
  )
}

为什么params需要用大括号括起来,如果只是'const params = this.props.params'

3 个答案:

答案 0 :(得分:3)

这称为destructuring

而不是做

const params = this.props.params.params

你可以用短手

const { params } = this.props.params.

参见示例

const a = {
  key: 'value',
  key2: 'value2',
}

const {key} = a //getting a.key from a and assigning it to key

console.log(key)

const { key2: newVar } = a //getting a.key2 from a and assigning it to newVar

console.log(newVar)

希望这有帮助!

答案 1 :(得分:2)

namespace Data
{
    using System.Collections.Generic;
    using System.Linq;
    using System.Windows.Data;

    public class CollectionViewSource<T> : CollectionViewSource
    {
        public T CurrentItem => this.View != null ? (T)this.View.CurrentItem : default(T);

        public new IEnumerable<T> Source
        {
            get
            {
                return (IEnumerable<T>)base.Source;
            }

            set
            {
                base.Source = value;
            }
        }

        public IEnumerable<T> ViewItems => this.View != null ? Enumerable.Cast<T>(this.View) : (IEnumerable<T>)null;

        public CollectionViewSource(IEnumerable<T> source)
        {
            this.Source = source;
        }

        public bool Contains(T item)
        {
            return this.View != null && this.View.Contains(item);
        }

        public IEnumerable<T> Groups()
        {
            return this.View.Groups.Cast<T>();
        }

        public void MoveCurrentTo(T item)
        {
            this.View?.MoveCurrentTo(item);
        }
    }
}

相同
const { foo } = bar.baz

所以你真正在做的是将const foo = bar.baz.foo 设置为params

此外,这不是React的功能。相反,它是ES6 Javascript的一个功能。

答案 2 :(得分:0)

它被称为解构赋值。您可以从对象或数组中提取数据或元素。

const { params } = this.props 
is same as
const params = this.props.params;

您也可以从数组中提取元素

const x = [1, 2, 3, 4, 5];
const [a, b] = x // [1, 2];

最后,您可以选择是否使用它。