I am learning React JS and as of now I cannot find any example on the source code, tests or on the official docs. On the docs the touchStart
event is said to be supported but handleTouchStart
does not work.
The only place I found and example that actually works was on react-touch project.
The following code works, but is this the only way of binding? It looks like a cheap workaround for me.
var MyHeader = React.createClass({
handleTouchStart: function() {
console.log('handleTouchStart');
},
render: function() {
return this.transferPropsTo(
<header onTouchStart={this.handleTouchStart}>{title}</header>
);
}
};
What is actually the proper way of doing this?
One-way Data Binding: ReactJS uses one-way data binding. In one-way data binding one of the following conditions can be followed: Component to View: Any change in component data would get reflected in the view. View to Component: Any change in View would get reflected in the component's data.
ReactJS bind() Method The bind() is an inbuilt method in React that is used to pass the data as an argument to the function of a class based component. Syntax: this.
LinkedStateMixin is an easy way to express two-way binding with React. In React, data flows one way: from owner to child. We think that this makes your app's code easier to understand. You can think of it as “one-way data binding.”
Just adding return false; at the end of the on("click touchstart") event function can solve this problem.
Since React v0.14, you don't have to call React.initializeTouchEvents(true);
manually anymore.
http://facebook.github.io/react/blog/2015/10/07/react-v0.14.html#breaking-changes
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With