选择功能

assets/a.scss

@@ -125,7 +125,7 @@ body {
         padding-bottom  : 75px;
         background-color: #f8f9fa;
         height          : 90%;
-        background      : #fff;
+      
 
         li {
             height          : 302px*$a;

assets/select.scss

@@ -4,6 +4,7 @@ $h:88px;
     height       : 44px;
     border-bottom: 1px solid #EFEFEF;
     line-height: 44px;
+    background: #fff;
     .region {
         height    : 100%;
         width     : 49%;

components/select.vue

@@ -1,14 +1,16 @@
 <template>
   <div class="select">
-    <div class="region">
+    <div class="region" @click="regions(0)">
       地区
-      <img src="../static/img/open.png" alt>
+      <img src="../static/img/open.png" v-if="!region[0]" alt>
+      <img src="../static/img/hide.png" v-else alt>
     </div>
-    <div class="region">
+    <div class="region" @click="regions(1)">
       类别
-      <img src="../static/img/open.png" alt>
+       <img src="../static/img/open.png" v-if="!region[1]" alt>
+      <img src="../static/img/hide.png" v-else alt>
     </div>
-    <div id="region" v-if="region">
+    <div id="region" v-if="region[0]">
       <ul class="left">
         <li>全国</li>
         <li>华北</li>
@@ -29,14 +31,14 @@
         <li>辽宁省</li>
       </ul>
     </div>
-    <ul id="category" v-if="category">
+    <ul id="category" v-if="region[1]">
       <li>535656</li>
       <li>535656</li>
       <li>535656</li>
       <li>535656</li>
       <li>535656</li>
     </ul>
-    <div class="bg" v-if="region||category"></div>
+    <div class="bg" v-if="region[0]||region[1]"></div>
   </div>
 </template>
 <script>
@@ -44,15 +46,19 @@ import '~/assets/select.scss'
 export default {
   data() {
     return {
-      region: false,
-      category: false
+      region: [false, false],
+      img: ['open', 'hide']
     }
   },
   created: function() {},
   methods: {
-    addTodo(e) {
-      this.$store.commit('todos/add', e.target.value)
-      e.target.value = ''
+    regions(e) {
+      const region = [false, false]
+      region[e] = true
+      const img = ['open', 'hide']
+      img[e] = 'hide'
+      this.img = img
+      this.region = region
     }
   }
 }