不需要标题,是两个合在一起,而不是分开的
时间: 2024-04-09 18:33:53 浏览: 22
如果你不需要标题,只是将选择器和输入框合在一起,你可以使用 `el-row` 和 `el-col` 组件来实现。以下是一个示例代码:
```html
<template>
<el-row>
<el-col :span="12">
<el-select v-model="selectedOption" placeholder="请选择">
<el-option label="选项1" value="option1"></el-option>
<el-option label="选项2" value="option2"></el-option>
<el-option label="选项3" value="option3"></el-option>
</el-select>
</el-col>
<el-col :span="12">
<el-input v-model="inputValue" placeholder="请输入"></el-input>
</el-col>
</el-row>
</template>
<script>
export default {
data() {
return {
selectedOption: '',
inputValue: ''
};
}
};
</script>
```
在上面的代码中,我们使用 `el-row` 和 `el-col` 组件将选择器和输入框合在一起。左侧的 `el-col` 使用了 `:span="12"`,占据了一半的宽度;右侧的 `el-col` 也使用了 `:span="12"`,同样占据了一半的宽度。你可以根据需要调整 `:span` 的值来控制宽度比例。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![application/x-rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)