前提・実現したいこと
Nuxtでアプリケーションを制作しています。
スワイプでページ遷移をするために、
vue2-touch-eventsをpluginで入れ、
nuxt-user-agentをmoduleで入れています。
各pagesのhtml(pug)に、
article(
v-touch:swipe.left="() => { if(!$ua.isFromPc()) $router.push('/leftPage') }"
v-touch:swipe.right="() => { if(!$ua.isFromPc()) $router.push('/rightPage') }"
)
を設定しています。
発生している問題・エラーメッセージ
アンドロイドでは問題なく動くのですが、 アイホンの場合、スワイプでページ遷移した後、 リンク(nuxt-link)を踏んでも動作しません。 遷移後、リンクを二回押したり、スクロールなどした後では普通に動作します。
該当のソースコード
<template lang="pug"> article( v-touch:swipe.left="() => { if(!$ua.isFromPc()) $router.push('/leftPage') }" v-touch:swipe.right="() => { if(!$ua.isFromPc()) $router.push('/rightPage') }" ) section ・・・以下略・・・ </template> <script> export default { layout: 'XXX', async asyncData ({ context, app, error }) { try { const [deviceType, XXX] = await Promise.all([ app.context.$ua.deviceType(), app.$axios.$get(`https://XXX/XXX.json?timestamp=${new Date().getTime()}`) ]) return { deviceType, XXX } } catch (err) { error({ statusCode: err.response.status, message: err.response.data.message }) } } } </script>
試したこと
アイホンとアンドロイドの実機でテスト
補足情報(FW/ツールのバージョンなど)
あなたの回答
tips
プレビュー