React(JSX语法)-----JSX属性

1. if you know all the propertities that you want to place on a component ahead of time,it is easy to use JSX:

var component = <Component foo={x} bar={y}/>

2. This is an anti-pattern (反面实例---错误的) because it means that we can't help you check the right propTypes until way later.This means that your propTypes errors end up with a cryptic stack trace.

var component = <Component/>;

component.props.foo = x; //bad

component.props.bar = y;//also bad

　　the props should be considered immutable at this point(认为是不可改变的).Mutating the props object somewhere else could cause unexpected consequences so ideally it would be a frozen object at this point.

3.you can use a new feature of JSX called spread attributes:

var props = {};

props.foo = x;

props.bar = y;

var component = <Component {...props}>;

　　the properties of the object that you pass in are copied onto the component's props.you can use this multiple times or combine it with other attributes.The specification order id important.Later attributes override previous ones;

var props = { foo: 'default' };

  var component = <Component {...props} foo={'override'} />;

  console.log(component.props.foo); // 'override'

巴特西

React(JSX语法)-----JSX属性

最新文章

热门文章