antd input组件，获取焦点时更改该组件的样式

1. 首先给该组件注册一个失去焦点的事件

  <a-input-search
          placeholder="请输入搜索产品名称"
          class="header_input"
          @search="onSearch"
          @focus="focusSearch"
          @input="searchValue"
          v-model="searchText"
          ref="a_input_search"
        />

通过ref来获取dom节点

2. 获取焦点的事件

    focusSearch() {
      //搜索框获取焦点事件
     
      // 获取dom元素，更改他的样式
      console.log(this.$refs.a_input_search.$el);
      this.$refs.a_input_search.$el.style = "margin-left:300px;width:250px;";
  
    },

因为a-input-search是一个组件，这个组件中控制样式的并不是ref获取的这个dom，而是它下面的$el, 所以给$el设置样式

效果如下：