Version

3.0.11

Reproduction link

https://codesandbox.io/s/tender-driscoll-4iv0j?file=/src/App.vue

Steps to reproduce

1. ios app webview loaded vue3 pages (使用app的webview载入vue3的页面)
2. webview will set some postMessage method to pass the value to achieve the web bridge which has a page load onLoad message, will trigger the event listener when mounted, but in vue3 listeners can not be triggered
3. vue2 and vue3 code

// vue2 code
  mounted() {
 
    document.addEventListener('message', e => {
      // useful 可以监听到
     alert(1111)
      console.log(1111, e)
      var info = JSON.parse(e.data)
     
      switch (info.msgType) {
        case 'onLoad':
        
          break
        case 'onShare':
         
          break
        default:
          break
      }
    })

  },
// vue3 code

   setup() {
      const activeName = ref('a')

      document.addEventListener('message', (e) => {
    //  unuseful 无法收到消息
alert(1111)
        console.log(e)
      })

      onBeforeMount(() => {
        document.addEventListener('message', (e) => {
 //  无法收到消息
          console.log(e)
        })
      })
      onMounted(() => {

        console.log(11111111111111)
        document.addEventListener('message', (e) => {
alert(1111)
 //unuseful   无法收到消息
          console.log(e)
        })
       
      })

      return { activeName }
    }
    })
       

我在手机app中使用webview载入vue3开发的页面,在页面载入时自定义发送一些消息,.在安卓上可以收到消息.在ios webview中,在vue2中可以收到,但是在vue3中无法收到

What is expected?

vue2 mounted and vue3 onMounted have the same effect

What is actually happening?

vue2 mounted 是有用的,可以监听到messagge消息,但是vue3无法监听到被动载入消息.其他手动触发的可以监听到

vue2 mounted is useful to listen to messagge messages, but vue3 cannot listen to passive loading messages. Other manually triggered ones can listen to

ios app webview loaded vue page and pass the message via postmessage

Hi, thanks for your interest but Github issues are for bug reports and feature requests only. You can ask questions on the forum, the Discord server or StackOverflow.

Cannot reproduce, you might be attaching the event listener too late

hello，现在这个问题解决了吗？需要在 Vue3 中注册使用 window 的 pageshow 事件，发现也不能注册，最后怎么解决呢？

@YY88Xu 解决了，是webview的触发时机不一致的问题，你也是用的webview？可以在加载vue之前就注册监听。然后发布订阅模式出发vue里面的回调

我看了一下应该是 Vue Router 4 的原因；单纯的 Vue3 是支持的，使用 Vue Router 然后在 setup 中注册是不起作用的。

@YY88Xu 那就直接在html里线注册，是由于vue router拖慢了vue3的setup时机，错过了监听触发的时机，所以才监听不到的。