Menu2.vue_20211220

<template>
    <div>
        <h4>메뉴2</h4>
        <h5>물품관리</h5>

        <el-table :data="items" size="mini" style="width: 100%;">
            <el-table-column label="아이디">
                <template #default="scope">
                    <el-input size="mini" type="text" v-model="scope.row.id" />
                </template>
            </el-table-column>

            <el-table-column label="이름">
                <template #default="scope">
                    <el-input size="mini" type="text" v-model="scope.row.name" />
                </template>
            </el-table-column>

            <el-table-column label="나이">
                <template #default="scope">
                    <el-input size="mini" type="text" v-model="scope.row.age" />
                </template>
                
            </el-table-column>
        </el-table><br />
                    <el-button type="primary" size="mini">일괄수정</el-button>

                <!-- <tr v-for="tmp in items" v-bind:key="tmp">
                    <td><input type="text" v-model="tmp.id" /></td>
                    <td><input type="text" v-model="tmp.name" /></td>
                    <td><input type="text" v-model="tmp.age" /></td>
                </tr>
            </tbody>
        </table>
        <input type="button" class="button4" value="일괄수정" /> -->
    </div>
</template>

<script>
    import axios from 'axios';

    export default {
        created() {
            this.handleItem();
        },
        // 메소드 쓰려면 호출해야함(created) but 원래 admin에서는 click할 때 나와야 해서 created가 필요 없음
        // 지금은 바로 나와야 하니까 created에 호출 해야함

        mounted() {

        },
        data() {
            return {
                items    : [],
            }
        },

        methods: { 
            changeMenu(no) {
                this.menu = no;
                if(this.menu === 2) {
                    this.handleItem();
                }
            },            
            async handleItem(){
                const url = "http://ihongss.com/json/exam13.json";
                const headers = { 'Content-type':'application/json' };
                const response = await axios.get(url, headers);

                if(response.status === 200){ 
                    this.items = response.data.data;
                    // response.data.data1
                }
            }, 
        }
    }
</script>

<style scoped>

</style>