uni-search-bar简单搜索效果

预期思路：input框内容变化，调用@input方法 拿到输入框的值发送到后端，接收到后端的数据，再利用this保存，但是input方法里没有this指向

uni-search-app组件很不错，样式好看，功能齐全，但是事件里面没有this指向，百度了也没有什么发现，后来想到一个一个办法，利用watch监听。
vue
vue2–watch

时间不够 贴个代码

<template>
	<view class="margin-top">

		<uni-search-bar @confirm="search" :focus="true" v-model="searchValue" />

		<view class="padding flex flex-wrap justify-between align-center bg-white" v-for="(item,index) in vips "
			@click="itemClick(item)">
			<text>{{item.userName}}</text>
		</view>

		<!-- 悬浮按钮 -->
		<uni-fab :pattern="pattern" :content="content" :horizontal="horizontal" :vertical="vertical"
			:direction="direction" @trigger="trigger"></uni-fab>

	</view>
</template>

<script>
	import {
		getAllUser,
		getUserByName
	} from "../../network/request.js"

	import mS from "../../components/mehaotian-search/mehaotian-search.vue"

	export default {
		components: {
			mS
		},
		data() {
			return {
				vips: [],
				searchValue: "",

				// 悬浮按钮
				pattern: {
					"color": "#fff",
					"selectedColor": "#ffffff",
					"backgroundColor": "#7952B3",
					"buttonColor": "#7952B3"
				},
				content: [{
					"iconPath": "../../static/img/add.png",
					"selectedIconPath": "../../static/img/add_active.png",
				}],
				horizontal: "right",
				vertical: "bottom",
				direction: "horizontal"
			}
		},

		/**
		 * watch 
		 */
		watch: {

			// 监听搜索框值的变化
			searchValue(n, o) {
				getUserByName(n.value).then(res => {
					var res = res[1].data.data
					this.vips = res
					console.log(res);
				})
			}

		},
		
		


		}
	}
</script>

<style>

</style>

效果