在 Vue 中，如果子组件和父组件都使用了相同的 ref 名称，那么会造成冲突。当一个 ref 被用在子组件上时，this.$refs 将会是一个对象，其中包含了所有具有 ref 的子组件。如果父组件和子组件都有相同名称的 ref，那么父组件的 ref 会覆盖子组件的 ref，也就是说，this.$refs 只会包含父组件的对应 ref，而不会包含子组件。

flex布局则是一种新的布局方案，通过为修改父div的display属性，让父元素成为一个flex容器，从而可以自由的操作容器中子元素(项目)的排列方式。