You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
volunteer-pc/src/views/components/myInput/index.vue

48 lines
896 B

2 years ago
<template>
<div class="my-inputs">
<el-input v-model="input" placeholder="请输入内容"></el-input>
<div class="btn" @click="inputValue"><i class="el-icon-search"></i></div>
</div>
</template>
<script>
export default {
data() {
return {
input:'',
}
},
methods:{
inputValue(){
this.$emit('changeInput',this.input)
},
},
}
</script>
<style lang="scss" scoped>
.my-inputs {
display: flex;
::v-deep .el-input {
width: 515px;
height: 40px;
.el-input__inner {
width: 100%;
height: 100%;
border-right: none;
border-radius: 4px 0 0 4px;
border: 1px solid #DBD7D7;
}
}
.btn {
display: flex;
align-items: center;
justify-content: center;
width: 52px;
height: 40px;
border-radius: 0 4px 4px 0;
background-color: #F8414D;
cursor: pointer;
color: #fff;
}
}
</style>