固定首页各区域,防止弹性变化

This commit is contained in:
lhj
2024-09-27 01:00:07 +08:00
parent bd2789a8d7
commit a43c13991b

View File

@ -3,26 +3,23 @@
<div>
compoent
</div>
<div style="overflow-y: auto;overflow-x: none;">
<div ref="el2" style="display: flex;flex-direction: column;height: 500px;width: 100%;">
<div v-for="item in componentsList" :key="item.id" style="height: 30px;width: 250px;border: 1px solid red;">
<div style="overflow-y: auto; overflow-x: hidden; flex-grow: 0; flex-shrink: 0; flex-basis: 250px;">
<div ref="el2" style="display: flex; flex-direction: column; height: 500px; width: 100%;">
<div v-for="item in componentsList" :key="item.id" style="height: 30px; width: 250px; border: 1px solid red;">
{{ item.name }}:{{ item.id }}
</div>
</div>
</div>
<div>
<div style="flex-grow: 1; flex-shrink: 0; overflow-y: auto;">
<div>
<div style="display: flex;flex-direction: row;width: 100%;">
<div v-if="list.length>0" class="flex justify-between">
<NestedFunction v-model="list"></NestedFunction>
<div
style="display: flex; flex-direction: row; width: 100%; height: 500px; overflow-y: auto; border: 1px solid black;">
<div class="flex justify-between">
<NestedFunction v-model="list"></NestedFunction>
{{ list }}
</div>
</div>
<div style="width: 800px;height:500px">
<div style="width: 100%; height: 500px; overflow-y: auto; border: 1px solid black;">
动态渲染
<!-- <component :is="componentMapping['Rate']" v-bind="{}"/> -->
<DynamicComponent v-for="component in list" :key="component.id" :componentData="component">
@ -35,7 +32,6 @@
</div>
</div>
</template>
<script setup lang="ts">