From 3b59500d23de33f6fd77c76112ff448bf4cfbbc7 Mon Sep 17 00:00:00 2001
From: "jqtmviyu@gmail.com" <jqtmviyu@gmail.com>
Date: Mon, 22 Feb 2021 21:53:38 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=86=E7=B1=BB=E9=A1=B5=E5=B7=A6=E5=8F=B3?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages.json                  |  15 ++--
 src/pages/category/category.vue | 147 +++++++++++++++++++++++++++++++-
 2 files changed, 152 insertions(+), 10 deletions(-)

diff --git a/src/pages.json b/src/pages.json
index e9795e5..d575016 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -2,19 +2,20 @@
   "easycom": {
     "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
   },
-	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
-		{
-			"path": "pages/index/index",
-			"style": {
-				"navigationBarTitleText": "首页"
-			}
-    },
+  "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
     {
 			"path": "pages/category/category",
 			"style": {
 				"navigationBarTitleText": "分类"
 			}
     },
+		{
+			"path": "pages/index/index",
+			"style": {
+				"navigationBarTitleText": "首页"
+			}
+    },
+
     {
 			"path": "pages/cart/cart",
 			"style": {
diff --git a/src/pages/category/category.vue b/src/pages/category/category.vue
index f9a2f19..4a6ce17 100644
--- a/src/pages/category/category.vue
+++ b/src/pages/category/category.vue
@@ -1,15 +1,156 @@
 <template>
-  <view>
-    category
+  <view class="category">
+    <!-- 搜索 -->
+    <view class="category_search">
+      <u-search placeholder="搜索" :show-action="false" ></u-search>
+    </view>
+    <!-- 内容 -->
+    <view class="category_content">
+      <view class="menu">
+        <view>1</view>
+        <view>2</view>
+        <view>3</view>
+        <view>4</view>
+        <view>5</view>
+        <view>6</view>
+        <view>7</view>
+        <view>8</view>
+        <view>9</view>
+        <view>10</view>
+        <view>11</view>
+        <view>12</view>
+        <view>13</view>
+        <view>14</view>
+        <view>15</view>
+        <view>16</view>
+        <view>17</view>
+        <view>18</view>
+        <view>19</view>
+        <view>20</view>
+        <view>21</view>
+        <view>22</view>
+        <view>23</view>
+        <view>24</view>
+        <view>25</view>
+        <view>26</view>
+        <view>27</view>
+        <view>28</view>
+        <view>29</view>
+        <view>30</view>
+        <view>31</view>
+        <view>32</view>
+        <view>33</view>
+        <view>34</view>
+        <view>35</view>
+        <view>36</view>
+        <view>37</view>
+        <view>38</view>
+        <view>39</view>
+        <view>40</view>
+        <view>41</view>
+        <view>42</view>
+        <view>43</view>
+        <view>44</view>
+        <view>45</view>
+        <view>46</view>
+        <view>47</view>
+        <view>48</view>
+        <view>49</view>
+        <view>50</view>
+      </view>
+      <view class="category_list">
+        <view>1</view>
+        <view>2</view>
+        <view>3</view>
+        <view>4</view>
+        <view>5</view>
+        <view>6</view>
+        <view>7</view>
+        <view>8</view>
+        <view>9</view>
+        <view>10</view>
+        <view>11</view>
+        <view>12</view>
+        <view>13</view>
+        <view>14</view>
+        <view>15</view>
+        <view>16</view>
+        <view>17</view>
+        <view>18</view>
+        <view>19</view>
+        <view>20</view>
+        <view>21</view>
+        <view>22</view>
+        <view>23</view>
+        <view>24</view>
+        <view>25</view>
+        <view>26</view>
+        <view>27</view>
+        <view>28</view>
+        <view>29</view>
+        <view>30</view>
+        <view>31</view>
+        <view>32</view>
+        <view>33</view>
+        <view>34</view>
+        <view>35</view>
+        <view>36</view>
+        <view>37</view>
+        <view>38</view>
+        <view>39</view>
+        <view>40</view>
+        <view>41</view>
+        <view>42</view>
+        <view>43</view>
+        <view>44</view>
+        <view>45</view>
+        <view>46</view>
+        <view>47</view>
+        <view>48</view>
+        <view>49</view>
+        <view>50</view>
+      </view>
+    </view>
   </view>
 </template>
 
 <script>
+let categoryData = {}
 export default {
 
+
 }
 </script>
 
-<style>
+<style lang="scss">
+.category {
+  display: flex;
+  flex-direction: column;
+  height: 100rpx;
+  .category_search {
+    padding: 10rpx;
+    background-color: red;
+  }
+  
+  .category_content {
+    height: calc(100vh - 100rpx);
+    display: flex;
+    .menu {
+      width: 180rpx;
+      background-color: aqua;
+      overflow: auto;
+      /* 
+      不加overflow: auto;的话
+      1.背景只有一屏
+      2.没有滚动条,滑动左边, 右边跟着一起动
+      */
+    }
 
+    .category_list {
+      flex: 1;
+      background-color: yellow;
+      overflow: auto;
+    }
+  }
+}
 </style>
\ No newline at end of file