reactjs – React,为什么{}在将道具传递给无状态功能组件时？

发布时间：2020-12-15 05:05:50 所属栏目：百科来源：网络整理

导读：我的感觉是({course})语法是从props对象中提取属性’course’.从而在组件内部调用“课程”属性更加简洁.如果我使用(props)语法传递道具,而不是({course}).然后,我必须说’props.course.authorId’,例如. 我的思路是否正确？如果你可以扩展这里发生的最新情况

我的感觉是({course})语法是从props对象中提取属性’course’.从而在组件内部调用“课程”属性更加简洁.如果我使用(props)语法传递道具,而不是({course}).然后,我必须说’props.course.authorId’,例如.

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

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;

你是对的.在ES6语法中,函数签名

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

与ES5代码相同

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

这称为destructuring.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!