vue3 动态组件和异步组件同时使用的时候,发现页面一旦元素发生变化,就会导致子组件重新触发mounted?-灵析社区

三千米的偷感

父组件 其他元素 点击 import { defineAsyncComponent } from "vue"; //这里的name必须由外面传递 const ddd = (name) => { return defineAsyncComponent( async () => await import(`./${name}.vue`), ); }; const show = ref(false) 子组件: import { onMounted } from "vue" onMounted(() => { console.log('触发mounted') }) 测试1 .read-the-docs { color: #888; } 导致子组件`mounted`一直触发的原因是什么?`keepAlive`好像也没有作用? [在线demo](https://link.segmentfault.com/?enc=SOuXduVGpSUlNgC9ZoGXiA%3D%3D.S8U27yAlqdWhuzmPG3JVxgl4C2oUaGJTw28OsuhBwxCzddyKscbfPd%2BVdVnW4u555d%2F5JfHMWqnU4Ng%2FDs3dzwQ7u6nJCdBfBSGCED6Lq34ZCipV2Ea0eHQB%2B0D8bTrx2TVtmuEDwQBjpRMxCl9ZFtZTBD9oMQJKZazcajor93iCkNP9Kf76%2BzCkpUHhYD2%2FMV0ymqzbWq5XZGQwlphxC%2BKDG5cI27Z1aYJKz0vTroivjGXPGF8VYNg%2BnVMUhdr3YstRQ4h5H9vaJmG1zgI8RAsVMP17XwJ%2B01sYPyf93PyTDdBrUINXhEPDfRHNNIm9RGY8%2F2Hg8Guo%2B40EZz0F3U1fixii3OUcd%2FERHdlGXLm6h7yN%2BHZ9iyhYv%2Fu6tX00S3y2LLUWSLjM9kTOEtYlaqv3x5THUkMB96HTx%2Bcb%2Fdis%2BvCwq%2F%2BpXAD5ie3qFB%2Fvb3wZcbCNfqwXEkpON7xMwHG9dxQFI%2Ba30tmFlMDpKQcL%2BXBMZH90YzYwJfKSFj1tow2vklbAqcdJ0r3h9tKbEAhwL1sN2IB9KLv8lMVyObYj%2FybvgXnVp4WmOS3zUBzsWU5RjJOF5nqnPaERhZ3fo0BjwL34qDzQ4tFNAwrTOrs4WaO2FyeUsXeWkdbJ7mRSqLAlcJP0H123%2BZU%2Bdrc3it%2BLcRJMxxOEG2c99Fu%2F%2BLddeAwRoCBFFwypJHZAID2ndBalL%2BHsSQRPUPPDm5BnCDn%2BXeNVBIJIuYkRPeILtNirCwdholCjANoeLZnsBPqXF5jWJR%2FcCEq5eCz0e%2FT0V7G30QW6g5wkDbpukpSMwZIMdgvU1dWV9NqaRjKxsBREgpVlZLx6kPKwe35nxQsIfh%2B%2FyfiiHBH5DeqD5Ipl0y697pctWdAEKt77F7%2FI114ANku239eDSFYzn7stmK0Ow7YkxoFH4iZi7ukopxvN8q4ExONY%2BCq2qyxFiOtUxpbFYMF7vnu3qgSX0QQCO%2FEcYN4GqZx0P84tBAn4Term6OOE4bOivog4iNcZknQeyE0mPMko73cdRX3POlPGhtGihsf%2F6jsgVpP4xg6g4mud3wdv2fjG2fGPrrlDCkXn5ALT2xSAFrlq%2BHMHkOC29JMr1QC%2B4TqeVH3bjO0Ey97J95a7vh6wK93mG1wrXJFT%2FAbFGyidVf8wQ%2FDjsq5oqMSduxGaXZs9Pr36bK%2FCGvD8u4MtKk%2BZaFq9o0Y6QmbJAtT8T5M64bF2QyMasjiVagzmBLOTlpy2utwHbSyAfTJ%2B7W8Gf%2Bbx9fiaktK7xVhBOo5VQ6GK39lspKAqinEP2k9ZrC0vkux8wiuqJOGtEn66YNoC3M7ZZOHqqpcejAVLo4SYzBGxAl0mb4sPyXgZMyNyF30lHgVsEP%2Bubwp37e2%2FEvYBDdWSp%2BQ0%2FeAiUaqUCLHyBA5e60zMrGIYdX7cBplXx1r2w4ipl4W%2ByNlUAQii8GF1HQgwhSK1wz4kzp4sTwNz7STx70KkDCbC2%2FceuDQk56P9WmmjmM83JckKZY%2B6izZnvCi%2FyUPb3cOriW0draaJwL62xMkd91JECdwggpDHNoLTuJQBn9UpHNB%2B%2BKr8oY65FIYN2wTPrhgEKTZro5sVWVyLswRkQEwKUdYkbYC44oiCgJhajGXEtYV3xYvn27V8umyngHRNtFxbX0cox%2BcjqxYV24WofqKGvl0JQx8Bget%2BkbCZW4VtLlTz%2B5gEtmuKNR9EhtRlXu9VHbiYuAP4u5h%2BwGSqU0ndZit8SgtOP%2F9gN4t0pLuyDvW50qgPAdpVWyc3ry0IhDferMp5%2BzJBe7pJO8xIPET64irwU0Px70vxUgQF%2B7oeQExcg%2FIWmqnKN9xbh4nA4WsDxMZRfq2ANL283mqkkUjALXHnn8jQPb3PugWU78QPwzCAI40EKhki8Tf604iCuuaYZXusFStrFrNRo14410wsnm4m8Wwgn5D205w9BWFBeL%2Fw%2FljR2%2FJfWb5so21goCJXhvoD%2BD3Frzx4%2BWLSug18PvCC3eeX%2FTTAva4ji0CfZr3osuZt0Sz%2F0TG%2B0gVz8yKowdSXTZ3SDMvVE1casYftUJVT54SuqrKMEiXdIcWaoVtExbp%2BqTfvT%2B8sq6KCLl5FPttTT%2BckKD7uvULUe8IqKKf9ds5%2FNphjBpgMVoyg2K9QmGauqbtJxfY1QYS8F4iUctv471lP2zt9EXyICWbYx8Ue5HXr07gkmyjvzpogjbcumOYx7UCkwsRE52CJeTwaCOPvl1FlXMt30baJqPZaAICWABd%2FZffXAxSB98QNTCpVo4P6Jo6xp1p9%2FaFuo%2FPDkW%2Ft4D8PnPPgKIfxC1w8IwDN8E5JXsbIhWsvQ%2FESF3vUJ80KNra8qpoOI8YTQozM87ZiQ82m6QzVUoVqJEv8uJAQy1O493qA%2BCDIrSxkRSY4J%2FbVswNQBlU9wigP1nLXDaYfOf169wq7c555LL5ZpYlQuvfnl4RPTUEFYZnI2tgnme8tAVaMyr4KFEkeFrBE4DcXQg5kaC6PbUveYueO1Ai%2FUUd8t%2F4l3D5iwm8RsQTRUzv71uPjJevBZGCbiq%2B2dfd33KeFqksHE1JXft3ZyIl8wcrg3391dZCR9JFom7N6LC7OB5XdBY5%2FDt%2FxRpRhQf7nepweK%2FSoX9EI0M876ZaXQC0i7aiWaCtXat%2BpcD2a15Thxl7pGlaYpyrQxB0Fudy3OisfAG%2F%2FHxJxZzMsZZHHSHtTA3UmZYMR9zQCTRYf6mLvVOdjLf%2F6IckBwxwCaXIYv%2BDxKVoYdoGE%2FInJnpE12v3PI%2BjSCc2luf3eta%2BTRiKmUfHVJ7TmzJtOQtfC95p26vn4b7X5F15SrhvgdXY6tEenpPEqbxqKm26EAurO32WoTf9v6NyB0lW1lU0y8triZI5VNVUJ0JEzakzn7sDnOm7gXszm%2F20Hoje97vEsUoI%2Bg1NUrlWnga8n9vs5FScuZxAGu%2FVQIc%2B9%2FtPYTTa235SnlOI4E3Cs%2Bhn4nxYqp0llrbFxFBCpvYihD9XcCvfLCt6pEHqACoYuXaGyvP3vWfefVlZQpVg%2BV3AHzldpwSkV1PrpT9JPwYoKSNptZb5QcREMvdwhhJiquiSCNKsEx44Pn9dEBhkTSgKyBH8GCpu%2FlO3lnziHAhvFoLalR%2BWX3z9792LVQ9Tw78Sm9WatGDY%2F%2FFs7AGirbibTyslOSLzkD%2BlPArGNFu7oeE9YrAC%2BHzg6izZZ5RLrJyS2NFvuuf3Xg6NF1MQC1YuYZum9VLFBPaKAlvLd3Y5Yiq55y1Oip3dibaZ%2BkujteTdxXVMxM5o9mJI21LaHKcRdEliGeuSAfbT%2Buy5MuPXD2AdXHM2wAnkJAJGXTw%2Btlc1uTS1yGzBpmplIHfqcRl0U1upqsci5Jhw0av5lhExWL61e10TPHFi1QkYy2hrqiiOZ1lLTdbndK04vh6UHy3LXIFnu75YJrMZuTU%2BVL740AfQBTIPaYlkrFBxVQWeZaK0DuFXXp6F1jFHnXjGtxjQsTPVOeaAt6Y8fux0HYwlVXITfT%2F3stye98TG5PyfJowGIWgQ%2FQzqE3lni8%2F5heJCzcXSWqXyKgBSzP2dEKrHa79cqKB%2BtJTB8Q0vQ1EVfVh%2BL1nmZU7YQp%2FFM%2FxSKvaiRZwSd9wX2TUa%2F%2BkSAHYDD6hhgD0ycPlKGVTfenSn8iSsJ%2FDfiWP8gGD5sVALMs1eySj7M7snNUV2jTcG2DQHADZ11Rlrv6hBd7bolFDx98Zccd0qWsumuDI5QECLz9kbv1ZrSBTsMSPkRX33oZ0CjZxm2cJeMQbbF51tBWaX63BNSHRPgayClKbTD6fcprfenCaBXeBK7Tz3eq4x0JfYtT%2BC3692VfvdNMUbPxvjIBTuiISqXllngVDCyFj5ydhf8Uc2SmBrcO5aRN%2Bur3gK%2BdbxwrH%2FxigscNStbO0WyL2GiduYjiNjK3oMd8YNe1q%2F1X%2Buj4dH6pqrRIpr%2BnTpqAqwA8RdXh4baoDIad1KKCKfPjQgYoshM7k9SI06BBnYuei4%2FI1gQdZrbBfePA7stg%2BVdXfC%2BL%2BqCIcgwrWhW%2Bwl%2FjS51bhPAaSq3xoivRpfGEArQI8zEoBazp55x5Y4xmuC341MDsl3bTUzhoSl3VCWx1ZI9okKImbynJupDtxbQD9lm0apdkC5kvEovyM9k%2F1If2pk%2B8l4PFEceCf7ihixvjrkp8MchA1MNfL5EZAlR%2BKPPNUsIjsXOZNIJ5D8MxbwealjTRhMOWfuS%2FN9kwIAhmL7KagvIpRgD%2B8NDPhdgdi9Idcv7jM5gm%2BjpenlFOp1%2B%2FL6943nifRmp5SUbQN7BkDilOZLhM4Z0EVn4DyeH91OqbyhYU%2BHNJVxnE9raJAZl8AEla2bFLi8S%2BGCQChipCXiTKnAaTAvFW8Z8NJ4IgaHseOEd2RXlQojDSeS4PxVJ0hdJSrM10tQo70F%2FWjukWflYPGQtuINnVxgG1gn5svjUrlthTkOX2UqTUznVuF%2FVRdXpE3biRa6casXiEVgY3Wi8SPcHYNQpMfFlvNzphDX22vDAkQq0g0uGdSsjeOfEL54BkBamxJP7aNS4m2gZP7az2IUSZTIbYcPoLx7ihlBYJTT2yjW8YX8%2Bd1j%2FtAPbJggSrNPghGxFzZNyTQjsd%2BKglw8OlKisb59Tlnw5WOMnGpZdjXko8laGLH55mqkQRFa1wtJjUXtep0lqiYcxhXc%2FJeqVAaQpo%2BT7hFFJoqRrGkvuypq0a11L7NNsuv2dTaxmXYjaL0GVkVLtD%2F9pk530EINadYNVbJJexicb%2FpzkO%2FQz0I7xoy%2BmtNn8WpmLh%2BQovlv4lY5NycdgvsZBcmHYdYel4XlyjZsjBri2Zh6pr7tcEM8zIqEsPFe8UG2F0jfEh54Obaw7Ul567A73cqxNO%2B%2B17sjIlV2Auv6Az679R2m8ofK44%2FlkpskduRNpuB%2BWMG0Pi%2BnJEGkgGmdfY3lXGtWsZhuCVB%2FIaVONsIwYYzrdvpSL8yL8xecM0L1ZtkKb%2B8xzWYa%2FvK6NenieIHeJJI2Sntg7%2BFZIpgKbUUoDOLCQOzs4%2BvRnyc1e8sgaPn0sK%2FxUqvXg5%2Fk4IL2wK8PnJl0e66d7Gi%2F3hZmbJcPbgsPYMny0ripyRADQ%2BNdZkDY%2F0nqnq%2FSb3GWINH72xXHlTkeUlMZ2NmNn3aIJY25N2FL6yv7Dfgv08nnrbjAFuE2bRHxubqPijTQ4F%2FjQ1KO7rTGfgbC9CIbeoENOtC6XmO9aQ0wJLEMqMQ09owVAu4Vf7JYhCVrbDJyZI5sPnnUqx7eKUElNt4yOIrvENQdNr7%2FbCuX6BmSk4W%2FxbHNxtnDMc2UjZo5xdUHqoruV1HZ6xg7eYTC%2B%2FWlgWlFDe%2BszKtc4jjEdqDChToBoxSGdRP433yWTZ5iTWfB9xoZULReZt2wZ3t8ytMKrVZCJKSKv6EZp3AbOWu5WUspAP%2B%2FhtJj9Rxzpryd3GJUfl%2BWb6CNvQxrr%2FQfnxzQoUkElyP1t%2FsTGbnYX6TWYYl8YNglU38utcQvKC32nQk3iniaX7wLHXe0RHUcRSCN1gW2TFl%2F9qua7tjhKMi9GEELRQuJJY2eyg0e08qKz5V%2FcioifJ549x3tB3DMe00YbJJZR2SwIROn%2FzGinLmKEl83d5EtV4PZ7PDljqjGMjQtsEGkuy7TKoVeeWCl71aiFXDahqISeO1kaybKXIAayVfo7BcJU3kgD6Q4MRsQRo4f6yVrPgHKu9ItZ68qeNzpPYpMwobc17I0wzMMaw1hhggYoP%2FjLwc4FHnr8tL7IIKaiKn6FOUm6DrV3Rw%3D%3D)

阅读量:133

点赞量:0

问AI
"ddd"改成静态对象,不然每次都会返回一个新的构造器,"VNodeType"不一致,组件就会重新走一遍"unmount"、"mount"