|
|
@@ -4,11 +4,11 @@ |
|
|
|
<section class="nav"> |
|
|
|
<Nav :areaName="areaName"></Nav> |
|
|
|
</section> |
|
|
|
<!-- <el-carousel height="600px"> |
|
|
|
<el-carousel-item v-for="item in 1" :key="item"> |
|
|
|
<img :src="item" alt="" /> |
|
|
|
<el-carousel height="600px"> |
|
|
|
<el-carousel-item v-for="item in photo" :key="item"> |
|
|
|
<img class="img-carousel" :src="formatImg(item)" alt="园区图片" /> |
|
|
|
</el-carousel-item> |
|
|
|
</el-carousel>--> |
|
|
|
</el-carousel> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
@@ -16,7 +16,7 @@ |
|
|
|
//这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等) |
|
|
|
//例如:import 《组件名称》 from '《组件路径》'; |
|
|
|
import Nav from "@components/Header.vue"; |
|
|
|
|
|
|
|
import { formatImg } from "@/utils/common.js"; |
|
|
|
export default { |
|
|
|
props: { |
|
|
|
areaName: { |
|
|
@@ -24,6 +24,13 @@ export default { |
|
|
|
require: true, |
|
|
|
default: "", |
|
|
|
}, |
|
|
|
photo: { |
|
|
|
type: Array, |
|
|
|
require: true, |
|
|
|
default: ()=>[], |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
//import引入的组件需要注入到对象中才能使用 |
|
|
|
components: { Nav }, |
|
|
@@ -36,7 +43,9 @@ export default { |
|
|
|
//监控data中的数据变化 |
|
|
|
watch: {}, |
|
|
|
//方法集合 |
|
|
|
methods: {}, |
|
|
|
methods: { |
|
|
|
formatImg, |
|
|
|
}, |
|
|
|
//生命周期 - 创建完成(可以访问当前this实例) |
|
|
|
created() {}, |
|
|
|
//生命周期 - 挂载完成(可以访问DOM元素) |
|
|
@@ -47,9 +56,14 @@ export default { |
|
|
|
//@import url(); 引入公共css类 |
|
|
|
.banner { |
|
|
|
@include size(100%, 600px); |
|
|
|
background: url("~@assets/image/index/banner.png") no-repeat; |
|
|
|
background-size: 100% 100%; |
|
|
|
// background: url("~@assets/image/index/banner.png") no-repeat; |
|
|
|
// background-size: 100% 100%; |
|
|
|
|
|
|
|
position: relative; |
|
|
|
.img-carousel { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
.nav { |
|
|
|
z-index: 100; |
|
|
|
position: absolute; |