search组件

<template>
          <div class="chatSearch">
             <input type="text" v-model="input" placeholder="search...">
             <i class="icon iconfont icon-search"></i>
          </div>
     
</template>

<script>
export default {
     data(){
         return{
             
         }
     },
     props:{
         input:{
             type:String
         }
     }
}
</script>

<style lang="less" scoped>
     .chatSearch{
         height: 80%;
         margin-top: 1%;
         margin-bottom: 1%;
         width: 90%;
         position: relative;
         input{
             width: 100%;
             height: 100%;
             background-color: #EDEEF6;
             border: none;
             outline: none;
             box-sizing: border-box;
             padding: 5px;
             padding-left: 15px;
             border-radius: 15px;
             color: #C0C4CB;
         }
         i{
             position: absolute;
             right: 2%;
             font-size: 25px;
             color: #C0C4CB;
             cursor: pointer;
         }
     }
      input::-webkit-input-placeholder{
            color:#B8BDC3;

        }
</style>