Nuxt - Как я могу запустить код на стороне клиента после рендеринга на стороне сервера?

Я создал плагин, внедряющий ноти (https://ned.im/noty/#/) так что я могу использовать его глобально, это выглядит так:

export default ({ app }, inject) => {

    const notify = function (options = {}) {
        if (process.client) {
            new Noty(options).show();
        }
    }

    app.$notify = notify;
    inject('notify', notify);

}

Этот плагин показывает заметку только на стороне клиента. На стороне сервера уведомление не появляется, потому что оно может отображаться только в браузере. У меня есть страница с подробностями о продукте, и я получаю данные в методе asyncData. Когда продукт не был найден, я хотел бы показать уведомление с правильным сообщением и перенаправить пользователя на страницу со списком продуктов. Когда я меняю маршрут на стороне клиента, все работает отлично. Однако при загрузке первой страницы (например, я меняю URL-адрес вручную в браузере), что происходит на стороне сервера, уведомление не появляется, работает только перенаправление. У меня вопрос: как в этом случае показать нот? Как создать уведомление в браузере после SSR или как лучше всего решить мою проблему?

Есть ли способ запустить какой-либо код после того, как клиентская сторона уже отрисована (после рендеринга на стороне сервера)?


person Jakub Saleniuk    schedule 17.08.2018    source источник


Ответы (3)


Вы можете просто отключить ssr для этого плагина.

plugins: [
   ...,
   { src: '~plugins/yourplugin.js', ssr: false }
]
person Aldarund    schedule 17.08.2018

Хорошо, я нашел для этого модуль: https://github.com/potato4d/nuxt-client-init-module

person Jakub Saleniuk    schedule 19.08.2018

это невозможно точно знать (nuxt ‹= 2.14.0, когда я отвечаю), но вы можете комбинировать клиентский плагин и клиентское промежуточное программное обеспечение для достижения этого, пожалуйста, взгляните на эту ссылку:

https://github.com/nuxt/nuxt.js/issues/2653#issuecomment-390588837

person zia    schedule 24.08.2020