这篇博客展示了如何利用Vue.js和vue-resource库来创建一个百度搜索风格的下拉菜单。通过监听keyup和keydown事件，实现了输入框内容变化时动态加载数据以及使用上下键改变选中项的功能。在接收到输入时，会发送JSONP请求到百度接口获取搜索建议数据，并动态更新到列表中。此外，当按下回车键时，会打开包含搜索关键字的新页面。
在我们学习ajax的时候一定要做的例子就是下拉菜单了吧？为什么？因为当你输入一个值的时候下面的div里面会无刷新的去加入数据，当时的实现也是挺难的，反正比下面的vue实现难。。。下面我们来看看vue（我觉得vue的出现就是good啊）
<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<head>
<title>百度搜索</title>
<style>
.gray{
background: darkgray;
}
</style>
</head>
<script src="vue1.X.js"></script>
<script src="vue-resource.js"></script>
<body><div id="box">下面我们是为input加入事件，keyup事件就是当你搜索的时候随着你抬起来键盘，下面的li中加入值。下面我们还添加了keydown事件，能用到keydown事件的地方最好用keydown
最低0.47元/天 解锁文章
扫一扫
2456
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
