Vue 组件问题，为什么组件中的item获取不到,感谢回答

Question

<div id="box"><div class="content">            <div class="swiper-container animated fadeInRightBig">                <div class="swiper-wrapper" style="transform: translate3d(-288.5px, 0px, 0px)">//这里是组件                    <my-article v-for="item in list" v-bind:detial="item"></my-article>//这里是组件                </div>                <!-- Add Pagination -->                <div class="swiper-pagination"></div>            </div></div></div><script>    Vue.component('my-article', {        prop: ["detail"],        template: `<div class="swiper-slide">                        <div class ="img" style="background:url(/Images/Admin.jpg) no-repeat center center;background-size: 100%;width:60%;margin:0 auto;">                        </div>                        <div class="Gradients">                        </div>                        <a href="/Home/Admin">                            <p>{{item}}</p>                        </a>                    </div>`    })        var vm = new Vue({            el: "#box",            data: {                    list: ["/Images/show1.png", "/Images/login.jpg", "/Images/lesson.jpg", "/Images/Attendance.png", "/Images/Member.jpg", "/Images/Questionnaire.jpg", "/Images/Survey.png", "/Images/work_and_rest_time.jpg"]            }        })</script>

Answer 1

data里边没有item   当然获取不到