Чтение через документы, кажется, что теперь устаревшие cloneWithProps
объединили имя className
s, но cloneElement
игнорирует имя className
которое прошло
https://jsfiddle.net/z12hc5er/1/
var Foo = function () {
return <div className="shows-up">Hello World</div>;
};
var Bar = function () {
return React.cloneElement(<Foo/>, {className: 'ignored'});
};
ReactDOM.render(
<Bar/>,
document.getElementById('container')
);
Есть ли способ влиять на className клонированного элемента?
className
- это атрибут определенного элемента в Foo
, что, если у вас было несколько элементов с именами классов?
Второй параметр - для передачи реквизита. Реквизиты - это всего лишь способ передачи данных компоненту, реакция не предполагает, как вы хотите их использовать, поэтому вам нужно будет прямо сказать это, например:
var Foo = function (props) {
return <div className={props.className || 'shows-up'}>Hello World</div>;
};
var Bar = function () {
return React.cloneElement(<Foo/>, {className: 'not-ignored'});
};
ReactDOM.render(
<Bar/>,
document.getElementById('container')
);
Я думаю, они решили, что делать что-то особенное со style
и className
(и игнорировать key
и ref
) было слишком cloneWithProps
в cloneWithProps
.
Редактировать: смотрите здесь, похоже, что это было сделано по причинам оптимизации: https://facebook.github.io/react/blog/2015/03/10/react-v0.13.html