Table of Contents

Using JQuery with react

Basics

From Integrate jQuery UI autocomplete and React
JQuery UI widget lives outside react. React is not making any updates. 

render: function() {
  return (<div></div>)
},
componentDidMount: function() {
  $(React.findDOMNode(this)).jquery_widget({param1: 'value1', param2: 'value2'});
},
componentWillUnmount: function() {
  $(React.findDOMNode(this)).jquery_widget('destroy');
},
shouldComponentUpdate: function() {
  return false
},

Propagate changes from react to widget: 

componentDidMount: function() {
  this.updateAutocomplete();
},
 
componentDidUpdate: function() {
  this.updateAutocomplete();
},
 
updateAutocomplete: function() {
  var tags = this.props.tags;
  $(React.findDOMNode(this)).autocomplete({source: tags});
}

Improve performance: 

shouldComponentUpdate: function(nextProps) {
  return this.props.tags !== nextpProps.tags;
}

http://tech.oyster.com/using-react-and-jquery-together/

Wrapper: Use jQuery UI from React

Slider

Using non React components with React

Autocomplete

Integrate jQuery UI autocomplete and React

Sortable

Original post for old react version: https://gist.github.com/petehunt/7882164

Modified version: Using jQuery UI Sortable with React components

jQuery Mobile React Example