<a-modal><style lang="less" scoped> :deep(.formlist) { margin-top: 30px; .ant-col-24{ flex: 0 0 50% !important; } } </style>我想要实现弹窗里的表单一行两个显示,为什么不行,怎么实现 :visible="visible" :model="visibleView" :closable="true" :maskClosable="true" :onCancel="closeModal" :title="titles" :onOk="onSubmit" :getContainer="false" :width="1300" :footer="disabledmodal?null:undefined" > <FormList ref="refForm" :FormFiled="FormFiled" :defaultValue="visibleView" /> </a-modal>
时间: 2023-07-21 21:59:42 浏览: 102
根据你提供的代码,你想要在弹窗中表单一行显示两个字段。目前表单字段默认是一列显示的。要现一行两个字段的显示,你需要对表单进行一些调整。
可以使用 `ant-design `Row` 和 `Col` 组件来现这个效果。将表单字段裹在 `Row` 组件中,然后在每个字段外部使用 `Col` 组件,并设置 `span` 属性为 12,这样每行就可以显示两个字段。
下面是修改后的代码示例:
```html
<a-modal>
<!-- 其他属性省略 -->
<FormList ref="refForm" :FormFiled="FormFiled" :defaultValue="visibleView">
<Row>
<Col :span="12">
<!-- 第一个字段 -->
</Col>
<Col :span="12">
<!-- 第二个字段 -->
</Col>
</Row>
</FormList>
</a-modal>
```
通过将表单字段包裹在 `Row` 组件内,并在每个字段外部使用 `Col` 组件,你可以实现表单一行两个字段的显示效果。记得根据你的实际需求修改代码中的注释部分,替换为真实的表单字段。
阅读全文