渲染安裝
react-rails
包含一個檢視助手 (react_component)
和一個不顯眼的 JavaScript 驅動程式(react_ujs),它們協同工作將 React 元件放在頁面上。你應該在做出反應之後在清單中要求 UJS 驅動程式(如果使用 Turbolinks 則在 turbolinks 之後)。
檢視助手在頁面上放置一個 div,其中包含所請求的元件類和 props。例如:
<%= react_component('HelloMessage', name: 'John') %>
<!-- becomes: -->
<div data-react-class="HelloMessage" data-react-props="{"name":"John"}"></div>
在頁面載入時,react_ujs 驅動程式將使用 data-react-class 和 data-react-props 掃描頁面並安裝元件。
如果存在 Turbolinks,則會在頁面上安裝元件:change event,並在頁面上解除安裝:before-unload。建議使用 Turbolinks> = 2.4.0,因為它會暴露更好的事件。
在 Ajax 呼叫的情況下,可以通過從 javascript 呼叫手動觸發 UJS 安裝:
ReactRailsUJS.mountComponents()
檢視助手的簽名是:
react_component(component_class_name, props={}, html_options={})
component_class_name
是一個字串,它命名一個全域性可訪問的元件類。它可能有點(例如,“MyApp.Header.MenuItem”)。
`props` is either an object that responds to `#to_json` or an already-stringified JSON object (eg, made with Jbuilder, see note below).
html_options
可能包括:tag:
使用除 div 之外的元素來嵌入資料反應類和資料反應道具。prerender: true
在伺服器上呈現元件。**other
任何其他引數(例如 class:,id :)都會傳遞給 content_tag。