[Vue warn]: Cannot find element: #indexTop ；不能在每一个vue文件中进行独立的控制么
项目是用vue-cli生成的，然后在webstrom打开
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<base href="src/assets/">
<meta charset="utf-8">
<title>fuqing_studio</title>
</head>
<body>
<div id="app"></div>
<script src="/dist/build.js"></script>
<style>
@import "css/base.css";
@import "css/patient_education.css";
@import "css/swiper.min.css";
@import "css/mine.css";
</style>
</body>
</html>
main.js
import Vue from 'vue'
import VueRouter from 'vue-router'
import Index from './component/indexTop.vue'
new Vue({
render: h => h(Index),
}).$mount('#app')我希望进去的页面是首页顶部的轮播图<template>
<div id="indexTop">
<div class="swiper-container">
<div class="swiper-wrapper">
<div v-for="item in banners" @click="jumpUrl($index)" class="swiper-slide img"><img src="{{item.path}}" alt=""></div>
</div>
<div class="swiper-pagination"></div>
</div>
</div>
</template>
<script>
import Vue from 'vue'
import axios from 'axios'
Vue.prototype.$http = axios
new Vue({
data:{
banners:{ },
},
methods: {
jumpUrl: function(index){
}
},
mounted: function () {
this.$nextTick(function () {
var self = this;
axios.get('http://localhost:66/studio/banner')
.then(function(res){
console.log(res.data);
self.banners = res.data
})
.catch(function(err){
console.log(err);
})
});
}
}).$mount('#indexTop')
</script>然后就报错了，改了好半天都不行
