amis
amis copied to clipboard
flex布局组件,一行2列模式下,第一个flex里的表格开启了内容自适应,内容无法填充满
描述问题:
使用flex布局组件,一行2列模式下,第一个flex里的表格开启了内容自适应,内容无法填充满,第二个却可以。 我想一行2列 flex布局和分栏 都不好用,还有其他方式能正常展示么
截图或视频:
如何复现(请务必完整填写下面内容):
-
你是如何使用 amis 的? [email protected],低版本也存在这个问题
-
amis 版本是什么?请先在最新 beta 版本测试问题是否存在
-
粘贴有问题的完整
amis schema代码:
{
"type": "page",
"title": "Simple Form Page",
"regions": [
"body"
],
"body": [
{
"type": "flex",
"items": [
{
"type": "container",
"body": [
{
"type": "crud",
"syncLocation": false,
"api": {
"method": "get",
"url": "https://apifoxmock.com/m1/3546534-2258203-default/common/list",
"requestAdaptor": "",
"adaptor": "",
"messages": {}
},
"bulkActions": [],
"itemActions": [],
"filterSettingSource": [
"name",
"age",
"date",
"id",
"address",
"enable",
"image",
"imageList",
"imgsList"
],
"id": "u:7c7e6e81eb6d",
"perPageAvailable": [
5,
10,
20,
50,
100
],
"messages": {},
"autoFillHeight": true,
"columns": [
{
"label": "name",
"type": "text",
"name": "name",
"id": "u:e645296b7f6a"
},
{
"label": "age",
"type": "text",
"name": "age",
"id": "u:3aa128affa56"
},
{
"label": "date",
"type": "text",
"name": "date",
"id": "u:087b5befb2de"
},
{
"label": "id",
"type": "text",
"name": "id",
"id": "u:590f994127af"
},
{
"label": "address",
"type": "text",
"name": "address",
"id": "u:92a5e3ffa9cd"
},
{
"label": "enable",
"type": "text",
"name": "enable",
"id": "u:cf859674d49f"
},
{
"label": "image",
"type": "text",
"name": "image",
"id": "u:329628c5febb"
},
{
"label": "imageList",
"type": "text",
"name": "imageList",
"id": "u:a71f02c13c80"
},
{
"label": "imgsList",
"type": "text",
"name": "imgsList",
"id": "u:59896290c65c"
}
]
}
],
"size": "none",
"style": {
"position": "static",
"display": "block",
"flex": "1 1 auto",
"flexGrow": 1,
"flexBasis": "0px"
},
"wrapperBody": false,
"isFixedHeight": false,
"isFixedWidth": false,
"id": "u:26b7f3aa3b9f"
},
{
"type": "container",
"body": [
{
"type": "crud",
"syncLocation": false,
"api": {
"method": "get",
"url": "https://apifoxmock.com/m1/3546534-2258203-default/common/list",
"requestAdaptor": "",
"adaptor": "",
"messages": {}
},
"bulkActions": [],
"itemActions": [],
"filterSettingSource": [
"name",
"age",
"date",
"id",
"address",
"enable",
"image",
"imageList",
"imgsList"
],
"columns": [
{
"label": "name",
"type": "text",
"name": "name",
"id": "u:e65905c3c8df",
"placeholder": "-"
},
{
"label": "age",
"type": "text",
"name": "age",
"id": "u:5b24af957b6d"
},
{
"label": "date",
"type": "text",
"name": "date",
"id": "u:b7de5ede530a"
},
{
"label": "id",
"type": "text",
"name": "id",
"id": "u:649cc824eece"
}
],
"id": "u:b1ce6de41cd2",
"perPageAvailable": [
5,
10,
20,
50,
100
],
"messages": {},
"autoFillHeight": true
}
],
"size": "none",
"style": {
"position": "static",
"display": "block",
"flex": "1 1 auto",
"flexGrow": 1,
"flexBasis": "0px"
},
"wrapperBody": false,
"isFixedHeight": false,
"isFixedWidth": false,
"id": "u:da9564019295"
}
],
"style": {
"position": "relative",
"rowGap": "10px",
"columnGap": "10px",
"flexWrap": "nowrap",
"inset": "auto"
},
"id": "u:d2652672da16",
"isFixedHeight": false,
"isFixedWidth": false
}
],
"id": "u:2226de538e50",
"pullRefresh": {
"disabled": true
}
}
- 操作步骤 请简单描述一下复现的操作步骤...
👍 Thanks for this! 🏷 I have applied any labels matching special text in your issue.
Please review the labels and make any necessary changes.
mark
在flex 2列布局里 每列一个crud表格 第一个crud 的计算逻辑里会把cxd-container 元素的高度计算进行导致计算出现偏差,因为cxd-container 的 position是 static 或者是relative,这里如果要过滤cxd-container 要怎么判断合适
https://github.com/baidu/amis/pull/11251/files