vue的交互

交互

    Vue做交互需要引入一个库：vue-resouce.js

    get: 

    post

    jsonp

 

<script src="vue.js"></script>
<script src="vue-resource.js"></script>

<script>
var vm = new vue({
    data:{

    }
    methods:{
        get:function(){
             // get获取一个普通文本数据
             // get发送数据
            this.$http.get('a.txt'，{
                    a:1,
                    b:2
            }).then(function(res){  //导入了vue-resource.js才会有$http这个方法
                alert(res.data);
            },function(res){
                alert(res.data);
            })
        }
    }
});
</script>

# post
    methods:{
        post:function(){
             // 
             // post发送数据
            this.$http.post('a.txt'，{
                    a:1,
                    b:2
            }, {
                emulateJSON:true  // post请求加的头部
            }).then(function(res){  //导入了vue-resource.js才会有$http这个方法
                alert(res.data);
            },function(res){
                alert(res.data);
            })
        }
    }

methods: {
    get: function (ev) {
        if(ev.keyCode==38 || ev.keyCode==40){ //当按照上下键的时候停止搜索
            return
        }
        if(ev.keyCode==13){
            window.open('https://www.baidu.com/s?wd='+this.t1) //打开百度搜索
        }
        this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su', {
            params: {
                wd: this.t1  // 输入的关键词
            },
            jsonp: 'cb'  //callback函数的名称
        }).then(function (res) {
          this.myData=res.data.s;
          console.log(this.myData)
        }, function (err) {
            console.log(err.status);
        });
    },