hookehuyr

房间卡片组件获取字段方式优化

1 <!-- 1 <!--
2 * @Date: 2023-12-13 13:42:23 2 * @Date: 2023-12-13 13:42:23
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2023-12-27 16:01:27 4 + * @LastEditTime: 2023-12-27 17:41:27
5 * @FilePath: /meihuaApp/src/components/roomCard.vue 5 * @FilePath: /meihuaApp/src/components/roomCard.vue
6 * @Description: 房间详情组件 6 * @Description: 房间详情组件
7 --> 7 -->
...@@ -148,6 +148,27 @@ onMounted(() => { ...@@ -148,6 +148,27 @@ onMounted(() => {
148 room_type.value = props.data.room_type; 148 room_type.value = props.data.room_type;
149 }); 149 });
150 150
151 +watch(
152 + () => props.data,
153 + (val) => {
154 + if (val) {
155 + id.value = val.id;
156 + cover.value = val.cover ? val.cover : 'https://cdn.ipadbiz.cn/meihua/img1@2x.png';
157 + title.value = val.title;
158 + room_num.value = val.room_num;
159 + capacity.value = val.capacity;
160 + num.value = val.num;
161 + original_price.value = val.original_price;
162 + discount_price.value = val.discount_price;
163 + room_type.value = val.room_type;
164 + }
165 + },
166 + {
167 + deep: true,
168 + immediate: true
169 + }
170 +);
171 +
151 </script> 172 </script>
152 173
153 <style lang="less"> 174 <style lang="less">
......