Html
    Css
    Js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script src="http://www.jq22.com/jquery/vue.min.js"></script><script src="https://s1.pstatp.com/cdn/expire-1-M/vue/2.2.2/vue.min.js"></script>
<div class="wrap" id="app">
<div class="wrap_header">
<h1></h1>
<span class="cont" v-for="abc,i of cont">{{abc}}<div class="pos" @click="remove(abc,i)">x</div></span>
</div>
<div class="contenter">
<div class="block" v-for="item,i in date">
<div class="title">{{item.title}}</div>
<ul>
<li v-for="con in item.list" @click="addcontent(con.text,i)">{{con.text}}</li>
</ul>
</div>
<div class="clear"></div>
</div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
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
* {
margin:0;
padding:0;
}
ul,li {
list-style:none;
}
.clear {
clear:both;
}
.wrap {
width:1200px;
margin:50px auto;
}
.wrap .wrap_header {
width:100%;
padding:15px 10px;
box-sizing:border-box;
background:rgba(195,239,255,0.3);
}
.wrap .wrap_header h1 {
display:inline;
color:#666;
font-size:15px;
}
.wrap .wrap_header span {
display:inline-block;
padding:2px 10px;
background:#ffe4c6;
color:#f78000;
border:1px solid #ffbf7b;
font-size:12px;
border-radius:5px;
margin-right:30px;
position:relative;
}
.wrap .wrap_header span .pos {
position:absolute;
top:-1px;
right:-15px;
display:block;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
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
var datalist = [{
title: '',
id: '1',
list: [{
text: ''
},
{
text: ''
},
{
text: ''
},
{
text: ''
},
{
text: ''
},
{
text: ''
},
{
text: 'oppo'
},
{
text: '360'
},
]
},
{
title: '',
id: '2',
list: [{
text: '3.0'
},
{
text: '3.0-3.9'
},
{
text: '4.0-4.5'
},
{
text: '4.6-4.9'
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

vue产品筛选

vue写的商城产品筛选,适合初学者学习

7
      王鹏0
      2021/8/12 10:47:47
      this.$(this.cont, con, index)
          王鹏0
          2021/8/12 10:48:54
          $后加
      回复
      不是每个超人都叫咸蛋0
      2019/8/5 15:19:41
      不是每个超人都叫咸蛋0
      2019/8/5 15:19:02
      ??评论奖励 1 jQ币
      2019/2/11 12:27:49
      删除方法语句应该这样写:少了方法 this.$(this.cont, con, index)
          ??0
          2019/2/11 13:47:54
          $后面少了
      回复
      ??0
      2019/2/11 12:21:14
      点击×号,删除不了 回复