Question

我正在Rails使用webpacker react。

我正在我的视图文件中加载我的组件：

<div id="mycomponent"></div>
<%= javascript_pack_tag 'components/mycomponent' %>

在mycomponent中，我有：

document.addEventListener('DOMContentLoaded', () => {
  ReactDOM.render(
    <MyComponent />,
    document.getElementById('mycomponent'),
  )
})

因此，在初始页面加载时，mycomponent已安装但是，当我访问另一个页面时，回击或单击指向仪表板的链接（在本例中），组件不会加载。不得不点击刷新加载它。

我认为它与Rails正在使用的一些缓存技术有关？如何在每个请求中加载组件

Answer 1

所以turbolinks正在做一些优化。

当我更改页面时，意识到chrome检查器中的url保持不变。

从//= require turbolinks删除app/assets/javascript/application.js后，页面正在完全。

看到一些人指出jquery.turbolinks onload turbolink问题<?php $hub_verify_token = null; if(isset($_REQUEST['hub_challenge'])) { $challenge = $_REQUEST['hub_challenge']; $hub_verify_token = $_REQUEST['hub_verify_token']; } if ($hub_verify_token === VERIFY_TOKEN) { echo $challenge; } $update_response = file_get_contents("php://input"); //-----VERIFY LOG-----// $fh = fopen("log.txt", "w+"); fwrite($fh, $update_response); fclose($fh); ?>。虽然没经过测试。

Rails - React组件不会在第二页加载时挂载

1 个答案: