Laravel Vue.js Vuex Socket.io - 沟通但不更新

Question

有人可以导航我找到有关如何调试问题的正确步骤吗？我想我在尝试了2天以上才发现问题后就输了。

说明：

我将Socket.io与Vue.js和Vuex并行使用。 拥有Vue数据表组件，每次对数据库进行修改时，Vuex Store都会更新数据状态，因此每个组件都能够获得相同的数据。如图所示。

我在页面/alarms上有 Component1 和 Component2 ， Component3 和 Component4 页面/alarms2。

问题：

仅当您在页面/alarms上时，它才有效。我可以打开多个窗口，使用不同的帐户登录，但是当我在页面/alarms上更新数据中的某些内容时，其他窗口/标签（Chrome / firefox等）会反映在实际中时间。 但是，当我尝试在不同页面上使用相同的Vue组件时，假设我们有/alarms2个网址 - Vue DataGrid组件中的数据不会反映在/alarms页面上。

代码示例

路线：

Route::get('alarms', 'AlarmsController@index')->name('alarms.index');
Route::get('alarms2', 'AlarmsController@index2')->name('alarms.index2');

控制器：

class AlarmsController extends Controller
{
    /**
     * Renders a page with Important and Standard alarms only.
     *
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function index()
    {
        // Commands for contextual menu
        $commands = $this->getCommandsForMenu();

        return view('alarms.index', compact( 'commands'));
    }

    /**
     * Renders a page with the rest of alarms now included in alarms page.
     *
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function index2()
    {
        // Commands for contextual menu
        $commands = $this->getCommandsForMenu();

        return view('alarms.index2', compact( 'commands'));
    }

====更新====

仅当我在页面/alarms2上添加所有4个组件时，它才有效。但是我只需要其中的2个（Comp 3＆amp; 4），这些修改完成时不会更新。

任何人都有同样的问题并且可能知道解决方案吗？