夜光带你走进Vue.js（三十五）擅长的领域

最新推荐文章于 2021-06-30 20:12:27 发布

GeniusTeam-夜光

最新推荐文章于 2021-06-30 20:12:27 发布

阅读量156

点赞数

分类专栏： Genius-Vue.js

本文链接：https://blog.csdn.net/weixin_41987706/article/details/102475702

版权

Genius-Vue.js 专栏收录该内容

36 篇文章 0 订阅

订阅专栏

夜光序言：

他，粗布黑衫，撑一支长篙，悠悠然摆着渡船。

时而低垂眼睑，凝视碧波荡漾，时而遥望远方，望穿群山叠峦。

翘首以盼，烟云蒙蒙，烟波江上的亭阁影影绰绰，一个曼妙的身姿隐约闪现，更是为这幅美卷添了色彩。

正文：

<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>夜光：灵活使用之前学的，创建几个简单实例</title>

</head>





<body>
<div id="app">
    靓仔/靓女：请输入关键字：<input type="text" v-model="keyword" @keyup="sendJsonP(keyword)">
    <ul>
        <li v-for="r in result">{{r}}</li>
    </ul>
</div>
<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
<script src="https://cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"></script>
<!--<script src="../js/vue.js"></script>-->
<script type="text/javascript">
    window.onload = function () {
        new Vue({
            el: '#app',
            data: {
                keyword: '',
                result: ''
            },
            methods: {
                sendJsonP(keyword) {
                    let url = 'https://www.baidu.com/sugrec?pre=1&p=3&ie=utf-8&json=1&prod=pc&from=pc_web';
                    this.$http.jsonp(url, {
                        params: {
                            wd: keyword
                        },
                        jsonp: 'cb'//jsonp默认是callback,百度缩写成了cb，所以需要指定下                     }
                    }).then(res => {
                        if (res.data.g) {
                            this.result = res.data.g.map(x => x['q']);
                        } else {
                            this.result = [];
                        }
                    });
                }
            }
        });
    }
</script>

</body>
</html>

GeniusTeam-夜光

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
夜光带你走进Vue.js（三十五）擅长的领域

夜光序言：他，粗布黑衫，撑一支长篙，悠悠然摆着渡船。时而低垂眼睑，凝视碧波荡漾，时而遥望远方，望穿群山叠峦。翘首以盼，烟云蒙蒙，烟波江上的亭阁影影绰绰，一个曼妙的身姿隐约闪现，更是为这幅美卷添了色彩。正文：<!DOCTYPE html><html lang="en...
复制链接

扫一扫

专栏目录