init

components/articlecard/articlecard.js

@@ -0,0 +1,36 @@
+// components/shopcard.js
+import articleApi from "../../api/articleApi"
+
+Component({
+  
+  properties: {
+    data: {
+      type: Object,
+      value: {}
+    }
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    leavFor(e){
+      let id = e.currentTarget.dataset.id
+      articleApi.views({
+        id
+      }).then(res => {})
+
+      wx.navigateTo({
+        url: `/pages/subpages/articledetail/articledetail?id=${id}`,
+      })
+    }
+  }
+
+})

components/articlecard/articlecard.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    "van-tag": "@vant/weapp/tag/index"
+  }
+}

components/articlecard/articlecard.wxml

@@ -0,0 +1,22 @@
+<view class="shopcard" bindtap="leavFor" data-id="{{data.id}}">
+
+	<image class="shopcard_img" src="{{data.cover}}"/>
+
+	<view class="shopcard_content">
+
+		<text class="shopcard_content_title">{{data.title}}</text>
+
+		<!-- <view class="shopcard_content_auth">
+			<text wx:if="{{data.category == 2}}" style="color: #07C160;">免费
+      </text>
+      <text wx:if="{{data.category == 1}}" style="color: #d40909;">付费
+      </text>
+		</view> -->
+		
+		<view class="shopcard_num">
+			<!-- <text>下载：{{data.downloadNum}}</text> -->
+			<!-- <text>收藏：{{data.collectionNum}}</text> -->
+		</view>
+
+	</view>
+</view>

components/articlecard/articlecard.wxss

@@ -0,0 +1,37 @@
+.shopcard{
+	display: flex;
+	align-items: center;
+	height: 80px;
+	gap: 12px;
+}
+
+.shopcard_img{
+	width: 120px;
+	height: 100%;
+	border-radius: 4px;
+}
+
+.shopcard_content{
+	height: 100%;
+	flex: 6;
+	display: flex;
+	flex-direction: column;
+	gap: 6px;
+	justify-content: space-around;
+}
+
+.shopcard_content_title{
+	font-size: 16px;
+}
+
+.shopcard_content_auth{
+	font-size: 10px!important;
+}
+
+
+.shopcard_num{
+	font-size: 10px;
+	display: flex;
+	gap: 20px;
+	color: #707070;
+}