index.vue
1.12 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<template>
<transition name="fade">
<article>
<div contenteditable="true" ref="edit" class="contenteditable"></div>
<ul class="imgList">
<li v-for="(item,ind) in imgList" :key="ind"><img @click="EventClick(item)" :src="item" /></li>
</ul>
</article>
</transition>
</template>
<style scoped lang="less">
.contenteditable{ height:200px; border:#ccc solid 1px; width:400px}
.imgList {
li{
display: inline-block; padding:3px;border:#ccc solid 1px;border-left:none;
&:first-child{border:#ccc solid 1px}
}
}
</style>
<script>
import {mapActions,mapMutations} from "vuex";
export default {
data(){
return {
imgList:[
"image/img1.png",
"image/img2.png",
"image/img3.png",
"image/img4.png",
"image/img5.png"
]
}
},
created(){
this.init();
},
methods:{
init(){
},
EventClick(src){
let el = this.$refs.edit;
debugger
}
}
}
</script>