Home  >  Article  >  Backend Development  >  javascript - ajax与vue.js搭配

javascript - ajax与vue.js搭配

WBOY
WBOYOriginal
2016-06-06 20:11:582337browse

点击页面中的按钮触发ajax从服务器中读取数据,然后服务器中数据传到ajax中的回调函数,ajax中的回调函数的数据怎么结合vue.js实现列表渲染。

回复内容:

点击页面中的按钮触发ajax从服务器中读取数据,然后服务器中数据传到ajax中的回调函数,ajax中的回调函数的数据怎么结合vue.js实现列表渲染。

<code>
    <button type="button" v-on:click="btnClick()">{{name}}</button>

<script type="text/javascript">
        var vm = new Vue({
            el: "#body",
            data: {
                name: 'Vue.js'
            },
            methods: {
                btnClick: function() {
                    $.ajax({
                        type: "get",
                        url: "http://localhost:XXXX",
                        async: true,
                        success: function(data) {
                            vm.name = data.name;
                        },
                    });
                }
            }
        })
</script>
</code>

//http://localhost:XXXX这个路径就是服务器请求来的

vue-resource 官方http库

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn