输入框和单选框在同一行显示 elementUI
时间: 2023-09-28 14:12:23 浏览: 168
你可以使用 ElementUI 中的 `el-row` 和 `el-col` 组件来实现输入框和单选框在同一行显示的效果。
首先,将输入框和单选框分别放在两个 `el-col` 组件中,然后将它们放在同一个 `el-row` 组件中。设置 `el-col` 的 `span` 属性来控制它们占据的列数,从而实现同一行显示的效果。
下面是一个示例代码:
```html
<template>
<el-row>
<el-col :span="12">
<el-form-item label="输入框">
<el-input></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="单选框">
<el-radio-group>
<el-radio label="选项1"></el-radio>
<el-radio label="选项2"></el-radio>
<el-radio label="选项3"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
</template>
```
这样就可以实现输入框和单选框在同一行显示的效果了。你可以根据需要调整 `el-col` 的 `span` 属性来控制它们的宽度。