Im играет с MartyJS, marty-express и реагирует. и следующий код:Событие onClick не срабатывает ни в одном из моих компонентов
import React from "react";
import _ from "lodash";
export default class InputComponent extends React.Component {
constructor(props, context) {
super(props, context);
this.handleClick = _.bind(this.handleClick,this);
this.state = {count: props.initialCount};
}
handleClick() {
this.setState({count: this.state.count + 1});
}
render() {
return (
<div>
<div className="btn btn-primary" onClick={this.handleClick}>
Clicks: {this.state.count}
</div>
</div>
);
}
}
InputComponent.propTypes = { initialCount: React.PropTypes.number };
InputComponent.defaultProps = { initialCount: 0 };
И просто оказывается внутри другого компонента, как это:
import InputComponent from "./InputComponent";
...
<InputComponent />
компонент оказывается просто отлично. Я пробовал большинство примеров, которые я мог найти, следуя инструкциям по рефакторингу React.createClass на es6, и я сделал точно так же, как в учебнике, и он просто не работает ...
My Hunch начинает указывать на MartyJS, MartyJS и Marty-express должны делать рендеринг на стороне сервера начальной страницы, мой конструктор компонентов, если я помещаю в console.log, печатается на сервере и никогда не на клиенте. Я нахожусь на грани полного отказа от обработанной стороны сервера, потому что, похоже, так много специфических особенностей и документации нет.
Может ли кто-нибудь говорить об их опыте с этим? и, возможно, указать на какой-то код, который использует MartyJS без ССР?
Thanks
Я не знаком с Marty.js, но если вы выполняете односторонний рендеринг, вы также должны вызывать рендер на компоненте на стороне клиента, а не просто демпинг HTML в dom. В противном случае ваш обработчик событий не будет привязан к элементам. Когда вы это сделаете, вы по-прежнему получаете преимущества рендеринга на стороне сервера. – noveyak