element UI学习使用(1)
https://element.eleme.cn/2.6/#/zh-CN/component/container vue模块库,可复制直接使用
1、搜索框、下拉搜索框
<el-form :inline="true" class="demo-form-inline"><el-form-item label="结果搜索"><el-inputplaceholder="请输入内容"v-model="searchinput"><el-button @click="search_postman" slot="append" icon="el-icon-search"></el-button></el-input></el-form-item> <el-form-item label="选择语料"><el-select v-model="value" filterable placeholder="请选择语料"><el-optionv-for="item in options":key="item.value":label="item.label":value="item.value"></el-option></el-select></el-form-item></el-form><script>export default{name:"Export2Postman",data() {return {searchinput :'',options :[],value:'',}},methods: {search_postman(){}},}
</script>
2、单选
<template><el-radio-group v-model="radio2"><el-radio :label="3">备选项</el-radio><el-radio :label="6">备选项</el-radio><el-radio :label="9">备选项</el-radio></el-radio-group>
</template><script>export default {data () {return {radio2: 3};}}
</script>
3、多选
<template><!-- `checked` 为 true 或 false --><el-checkbox v-model="checked">备选项</el-checkbox>
</template>
<script>export default {data() {return {checked: true};}};
</script>
4、按钮组
<el-button-group><el-button type="primary" icon="el-icon-edit"></el-button><el-button type="primary" icon="el-icon-share"></el-button><el-button type="primary" icon="el-icon-delete"></el-button>
</el-button-group>