首先要引入sl-filter组件可以进入DCloud下载地址直接放上了
ext.dcloud.net.cn/plugin?id=3…
样式如下:
前端页面如下:
2 <view>
3 <sl-filter :ref="'slFilter'" :topFixed="false" :isTransNav="true" :navHeight="0" :color="titleColor"
4 :themeColor="themeColor" :menuList="menuList" @result="results" @click="getTender"></sl-filter>
5 </view>
6 </template>
7
8 <script>
9 import slFilter from '../../components/sl-filter/sl-filter.vue';
10
11 export default {
12 components: {
13 slFilter
14 },
15 data() {
16 return {
17 result: [],
18 themeColor: '#000000',
19 titleColor: '#666666',
20 filterResult: '',
21 menuList: [{
22 'title': '区域',
23 'key': 'salary',
24 'isMutiple': false,
25 'reflexTitle': true,
26 'detailList': []
27 },
28
29 {
30 'title': '招标动态',
31 'key': 'single',
32 'isMutiple': false,
33 'reflexTitle': true,
34 'detailList': []
35 },
36 {
37 'title': '日期',
38 'key': 'sort',
39 'isMutiple': false,
40 'reflexTitle': true,
41 'detailList': []
42 }
43 ]
44 }
45 },
46 methods: {
47 results(val){
48 let obj=val;
49 //获取的区域的选择项
50 var salary=obj.salary;
51 //获取的招标动态选择项
52 var single=obj.single;
53 //获取日期的选择项
54 var sort=obj.sort;
55
56 },
57 }
58 }
59 </script>
60
61 <style>
62
63 </style>
传值就根据自己写的传就可以了