vue操作,顯示數據

vue操作,顯示數據

1.操作頁面上的數據

組件中的內容

<template>
    <div class="about">
        <h1>這是課程頁面</h1>
        <button @click="test">點我</button>
        <p><button @click="data1">得數據</button></p>
        <p>{{course}}</p>
    </div>
</template>

操作組件中的數據

//頁面上的{{course}}數據
//在script中操作
<script>
    export default {
    	//data為操作數據的字段
        data:function(){
            return {
                course:['treadf']
            }
        },
        //methods為操作方法的字段
        methods:{
            test:function () {
                alert('test')
            },
            data1:function () {
                let _this = this
                this.$axios.request({
                    url:'http://127.0.0.1:8001/test/',
                    method:'get'
                }).then(function (response) {
                    _this.course=response.data
                })

            }

        }
    }
</script>