README.md in react-rails-2.4.4 vs README.md in react-rails-2.4.5
- old
+ new
@@ -85,10 +85,16 @@
$ rails g react:component HelloWorld greeting:string
```
Your component is added to `app/javascript/components/` by default.
+You can also generate your component in a subdirectory:
+
+```
+$ rails g react:component my_subdirectory/HelloWorld greeting:string
+```
+
[Render it in a Rails view](#view-helper):
```erb
<%= react_component("HelloWorld", { greeting: "Hello" }) %>
```
@@ -133,11 +139,11 @@
```
$ bundle exec rails webpacker:install:typescript
$ yarn add @types/react @types/react-dom
```
-Doing this will allow React-Rails to support the .tsx extension.
+Doing this will allow React-Rails to support the .tsx extension.
## Use with Asset Pipeline
`react-rails` provides a pre-bundled React.js & a UJS driver to the Rails asset pipeline. Get started by installing:
@@ -301,9 +307,22 @@
// Remove previous event handlers and add new ones:
ReactRailsUJS.detectEvents()
```
For example, if `Turbolinks` is loaded _after_ `ReactRailsUJS`, you'll need to call this again. This function removes previous handlers before adding new ones, so it's safe to call as often as needed.
+
+If `Turbolinks` is `import`ed via Webpacker (and thus not available globally), `ReactRailsUJS` will be unable to locate it. To fix this, you can temporarily add it to the global namespace:
+
+```js
+// Order is particular. First start Turbolinks:
+Turbolinks.start();
+// Add Turbolinks to the global namespace:
+window.Turbolinks = Turbolinks;
+// Remove previous event handlers and add new ones:
+ReactRailsUJS.detectEvents();
+// (Optional) Clean up global namespace:
+delete window.Turbolinks;
+```
### `getConstructor`
Components are loaded with `ReactRailsUJS.getConstructor(className)`. This function has two built-in implementations: