vue v-model 双向绑定+watch监听事件

（一）项目需求+效果图

1.需求

（1）点击搜索框，跳转页面，在搜索框下方显示具体的模块。
（2）点击具体模块，将点击的内容绑定到搜索框，同时查询出该模块的内容。
（3）删除搜索框内容，再次出现所有模块。

2.效果图：

（二）代码+代码解析

1.代码：

<template>
        <div id="type">
        <!--第一部分： 标题栏 -->
        <van-nav-bar
        title="我的审批"
        right-text="更多"
        left-arrow
         @click-left="onClickLeft"
         @click-right="onClickRight"/>   
        <form action="/">
          <van-search
          v-model="processName"
          placeholder="请输入学生姓名" 
          shape="round" 
          /> 
        <!-- 第二部分：点击搜索框时，显示的下拉菜单 -->
        <van-row>
        <!-- 后端显示的数据，每行显示3个，超过3个，自动到下一行 -->
        <van-col span="8" v-for="(item, i) of allProcessName" :key="i" justify="center"> 
          <van-cell-group v-show="isShow" @click="searchDetail(i)">
          <van-field v-model="allProcessName[i] "/>
          </van-cell-group>
        </van-col>
        </van-row> 
         <!-- 第三部分：内容(引入公共组件库) -->
        <headComponent :type="typelist"