vue 用axios获取的数据怎么不能渲染到页面?

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <link rel="stylesheet" href="../style/compStyle/index.css">

</head>

<body>

    <div id="app">

        <div class="header">

            <h1>{{message}}</h1>

        </div>

        <ul>

            <li v-for="item in todos" :key="item">{{item.name}}</li>

        </ul>

        <li @click="getAxios">

            Axios

        </li>

    </div>

    <script src="../node_modules/vue/dist/vue.min.js"></script>

    <script src="../node_modules/axios/dist/axios.min.js"></script>

    <script>

        var app = new Vue({

            el: '#app',

            data: {

                message: '四川政协网',

                todos:[]

            },

            methods:{

                getAxios(){

                    if(axios){

                        console.log('Axios')

                        axios.get('./app.json')

                        .then(this.getDate)

                        .catch(function (error) {

                            console.log(error)

                        })

                    }else{

                        console.log('无')

                    }

                },

                getDate(res){

                    console.log(res)

                    res = res.data

                    if (res.ret && res.data) {

                        const data = res.data

                        this.todos = data.todos

                    }

                    //console.log(res)

                }

            },

            mounted(){

                this.getAxios()

            }

        })

    </script>

</body>

</html>


毛Bing
浏览 5517回答 2
2回答

聪明的汤姆

语法明显错了吧axios.get().then(res => { this.getDate(res) })
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

Vue.js