Question

我的感觉是（{course}）语法正在提取属性＆＃39; course＆＃39;来自道具对象。从而打电话给＆＃39;当然＆＃39;组件内部的属性更简洁。如果我使用（props）语法传递道具，代替（{course}）。然后，我必须说“例如，props.course.authorId＆＃39;”。

我的思路是否正确？如果你可以扩展这里发生的事情，并填补任何空白，那将是很棒的。

import React, {PropTypes} from 'react';
import {Link} from 'react-router';

const CourseListRow = ({course}) => {
  return (
    <tr>
      <td><a href={course.watchHref} target="_blank">Watch</a></td>
      <td><Link to={'/course' + course.id}>{course.title}</Link></td>
      <td>{course.authorId}</td>
      <td>{course.category}</td>
      <td>{course.length}</td>
    </tr>
  );
};

CourseListRow.propTypes = {
  course: PropTypes.object.isRequired
};

export default CourseListRow;

Answer 1

你是对的。在ES6语法中，函数签名

const CourseListRow = ({course}) => { ... }

与ES5代码相同

var CourseListRow = function(props) {
    var course = props.course;
    ...
}

这称为destructuring。

React，为什么{}将props传递给无状态功能组件？

1 个答案: