Hooke / swx_weapp

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
ebfde2d3 1 parent 02ac33c3

活动卡片组件传值测试

Inline Side-by-side
Showing 2 changed files with 19 additions and 7 deletions
1 <!-- 1 <!--
2 * @Date: 2022-09-20 15:39:37 2 * @Date: 2022-09-20 15:39:37
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-09-21 10:41:18 4 + * @LastEditTime: 2022-09-21 11:08:31
5 * @FilePath: /swx/src/components/activity-card.vue 5 * @FilePath: /swx/src/components/activity-card.vue
6 * @Description: 活动卡片组件 6 * @Description: 活动卡片组件
7 --> 7 -->
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
14 </van-col> 14 </van-col>
15 <van-col :span="14"> 15 <van-col :span="14">
16 <view class="card-main-text"> 16 <view class="card-main-text">
17 - <view style="font-size: 1.1rem;">智慧没有烦恼</view> 17 + <view style="font-size: 1.1rem;">{{ data.title }}</view>
18 <view class="status-text"> 18 <view class="status-text">
19 <text>网络活动</text> 19 <text>网络活动</text>
20 </view> 20 </view>
...@@ -26,10 +26,10 @@ ...@@ -26,10 +26,10 @@
26 </van-row> 26 </van-row>
27 </view> 27 </view>
28 <view class="card-sub"> 28 <view class="card-sub">
29 - <van-row> 29 + <van-row v-if="data.address">
30 <van-col :span="24"> 30 <van-col :span="24">
31 <view> 31 <view>
32 - <van-icon :name="icon_address" size="0.95rem" />&nbsp;上海市杨浦区军工路100号A座05室 32 + <van-icon :name="icon_address" size="0.95rem" />&nbsp;{{ data.address }}
33 </view> 33 </view>
34 </van-col> 34 </van-col>
35 </van-row> 35 </van-row>
...@@ -52,9 +52,13 @@ ...@@ -52,9 +52,13 @@
52 </template> 52 </template>
53 53
54 <script setup> 54 <script setup>
55 -import { ref } from 'vue' 55 +import { ref, defineProps } from 'vue'
56 import icon_time from '@/images/icon/time@2x.png' 56 import icon_time from '@/images/icon/time@2x.png'
57 import icon_address from '@/images/icon/address@2x.png' 57 import icon_address from '@/images/icon/address@2x.png'
58 +
59 +const props = defineProps({
60 + data: Object
61 +})
58 </script> 62 </script>
59 63
60 <style lang="less"> 64 <style lang="less">
......
1 <!-- 1 <!--
2 * @Date: 2022-09-19 14:11:06 2 * @Date: 2022-09-19 14:11:06
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-09-20 17:18:28 4 + * @LastEditTime: 2022-09-21 11:02:56
5 * @FilePath: /swx/src/pages/index/index.vue 5 * @FilePath: /swx/src/pages/index/index.vue
6 * @Description: 首页 6 * @Description: 首页
7 --> 7 -->
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
26 <text class="bg-gradient" style="font-size: 1.15rem;">推荐活动</text> 26 <text class="bg-gradient" style="font-size: 1.15rem;">推荐活动</text>
27 </view> 27 </view>
28 <view style="padding: 0 1rem;"> 28 <view style="padding: 0 1rem;">
29 - <activity-card></activity-card> 29 + <activity-card v-for="(item, index) in activity_list" :key="index" :data="item"></activity-card>
30 </view> 30 </view>
31 </template> 31 </template>
32 32
...@@ -35,6 +35,14 @@ import Taro from '@tarojs/taro' ...@@ -35,6 +35,14 @@ import Taro from '@tarojs/taro'
35 import { ref } from 'vue'; 35 import { ref } from 'vue';
36 import activityCard from '@/components/activity-card.vue' 36 import activityCard from '@/components/activity-card.vue'
37 37
38 +const activity_list = ref([{
39 + title: '智慧没有烦恼',
40 + address: '上海市杨浦区军工路100号A座05室',
41 +}, {
42 + title: '万人共乘浪漫热气球',
43 + address: '',
44 +}]);
45 +
38 </script> 46 </script>
39 47
40 <script> 48 <script>
......