vue 循环找不到el元素

Question

问题描述

[Vue warn]: option "el" can only be used during instance creation with the `new` keyword. vue.esm.js:592:7
[Vue warn]: Cannot find element: #actionMovieFor

问题出现的环境背景及自己尝试过哪些方法

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

export default {
        el:"#actionMovieFor",
        data() {
            return {
                ftpIP: this.GLOBAL.ftpIP,
                server: this.GLOBAL.server,
                actionMovieTmps: {},
                artMovieTmps: {},
                funnyMovieTmps: {},
                ThrillerMovieTmps: {},
            }
        },........

<template>
    <div class="containerBody">
        <div class="panel panel-info moviepanel">
            <div class="panel-body" style="width: 100%; padding-top: 5px;">
                <div id="actionMovie" class="col-md-12 movie_container">
                    <div id="actionMovieFor">
                        <div v-for="(movie,index) in actionMovieTmps" :meta="movie" :key="index" v-on:click="getVideos(movie.id)" style="float:left;width:35%;height:75%;">
                            <p style="cursor: pointer;height:18;width:115px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;">{{movie.title}}</p>
                            <p style="height:18;width:70%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;" title="movie.description">{{movie.description}}</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>

你期待的结果是什么？实际看到的错误信息又是什么？

异步获取数据后循环遍历显示在页面上

Answer 1

el 是手动挂载(new 一个 Vue 实例的时候)的时候用的参数，表示把当前的组件挂载到这个 dom 元素上，你这里加 el 干什么

Answer 2

template标签内容天生不可见，设置了display：none；属性。因此，你想取template里边的ele元素，肯定是取不到的；

<template>
    <div id="cbox">11111111111</div>
</template>

<script>
    console.log( document.getElementById('cbox')) //null
</script>

其实你js不需要再设置el,因为这个文件在vue里已经是一个组件的形式。