Tengo una pagina como esta click para ver

Primero, la pila técnica que uso: Vue@2.6.11, element-ui@2.14.1

Las funciones que deben implementarse son:

cuando tengo un popover llamado 'A', y hay una etiqueta 'li' en él, configuro su modo de activación para que se desplace

y si uno de estos 'li' tiene subopciones, cuando paso el mouse sobre este 'li', como el botón 5 en este caso. Luego, el popover de anidamiento llamado 'B' aparecerá a la izquierda.

Pero, en este momento, cuando mi mouse deja el popover de anidamiento llamado 'B', desaparece 'A', no es lo que esperaba; me da dolor de cabeza

Trato de buscar plan por Google, pero no puedo encontrar. ¿Cómo podría resolver este problema? Gracias.

La dirección del código está aquí: https://codesandbox.io/s/vue-jsx-dml6s?file=/App.vue