vue使用插槽slot的過程中，父級組件設置了display：flex，但是插入組件的flex：1屬性不生效

在用vue開發組件的時候，我預期的效果是這樣的

但是實際開發的過程中出現了子組件始終不能均勻分佈的問題，flex：1屬性根本沒生效，如下效果：

於是仔細檢查每一處：
App.vue

TabBar組件

TabBarItem組件

發現了問題：
在TabBarItem組件的template中多嵌套了一層div，這是模板自動生成的我沒有刪除，導致實際的html機構是這樣的：

這樣的flex是肯定不會生效的，去掉多嵌套的那一層div，問題解決。