然后在一个初始样式里 然后点击搜索的时候 展示别的样式 前端如何用vue实现

可以使用Vue的条件渲染指令v-if或v-show来实现这个功能。

首先，在初始样式里，使用v-if或v-show指令来控制搜索框的显示和隐藏。例如：

<div v-if="showSearchBox">
  <!-- 搜索框代码 -->
</div>

或者

<div v-show="showSearchBox">
  <!-- 搜索框代码 -->
</div>

其中，showSearchBox是一个Boolean类型的变量，在初始状态下为false，因此搜索框不会被渲染出来。

然后，在点击搜索按钮时，修改showSearchBox变量的值为true，从而显示搜索框。可以使用Vue的事件绑定指令v-on来监听点击事件，并在事件处理函数中修改showSearchBox变量的值。例如：

<button v-on:click="showSearchBox = true">搜索</button>

其中，showSearchBox需要在Vue实例中定义为data属性。例如：

new Vue({
  el: '#app',
  data: {
    showSearchBox: false
  }
});

这样就可以实现在初始样式中隐藏搜索框，点击搜索按钮后展示别的样式的功能了。