微信小程序中,將搜索組件獲取的值傳遞給父頁面(如 index 頁面)可以通過 自定義事件 或 頁面引用 實現

將搜索組件獲取的值傳遞給父頁面(如 index 頁面)可以通過 自定義事件 或 頁面引用 實現

方法 1:自定義事件(推薦)
步驟 1:搜索組件內觸發事件
在搜索組件的 JS 中,當獲取到搜索值時,觸發自定義事件(如 search),并將值通過 detail 傳遞:

// components/search-component/search-component.js
Component({methods: {onSearchInput(e) {const value = e.detail.value; // 獲取輸入框的值this.triggerEvent('search', { value }); // 觸發事件}}
});

步驟 2:父頁面監聽事件
在父頁面(如 index)的 WXML 中綁定事件:

<!-- index.wxml -->
<search-component bind:search="onSearch"></search-component>

運行 HTML
在父頁面 JS 中定義事件處理函數:

// index.js
Page({onSearch(e) {const searchValue = e.detail.value; // 獲取子組件傳遞的值console.log('搜索值:', searchValue);// 這里可以調用接口或更新頁面數據this.setData({ searchKeyword: searchValue });}
});

Vant Card 卡片的price-top自定義價格上方區域

<van-card num="1"  price="{{item.roomFee}}"  title="{{item.roomName}}" thumb="{{ item.coverUrl }}" thumb-mode="aspectFill"
><!-- 使用 slot 而不是 # --><view slot="price-top"><text style="text-decoration: line-through; color: #999; font-size: 12px;">原價: {{item.originalPrice}}</text><van-tag type="danger" style="margin-left: 5px;">優惠</van-tag></view>
</van-card>

返回指定民宿在給定日期范圍內每天的預定狀態(可訂或不可訂)。

使用說明
參數說明:

#{roomId}: 要查詢的民宿ID

#{startDate}: 開始日期(格式:‘YYYY-MM-DD’)

#{endDate}: 結束日期(格式:‘YYYY-MM-DD’)

返回結果:

每行包含一個日期和狀態

status = 1: 該日期可訂

status = 0: 該日期已被預定

業務規則:

退房當天14:00前算占用(不可訂)

退房當天14:00后不算占用(可訂)

只考慮paid、checked_in、checked_out狀態的訂單

WITH date_series AS (-- 生成從startDate到endDate的日期序列SELECT DATE_ADD(#{startDate}, INTERVAL seq DAY) AS dateFROM (SELECT 0 AS seq UNION SELECT 1 UNION SELECT 2 UNION SELECT 3 UNIONSELECT 4 UNION SELECT 5 UNION SELECT 6 UNION SELECT 7 UNIONSELECT 8 UNION SELECT 9 UNION SELECT 10 UNION SELECT 11 UNIONSELECT 12 UNION SELECT 13 UNION SELECT 14 UNION SELECT 15 UNIONSELECT 16 UNION SELECT 17 UNION SELECT 18 UNION SELECT 19 UNIONSELECT 20 UNION SELECT 21 UNION SELECT 22 UNION SELECT 23 UNIONSELECT 24 UNION SELECT 25 UNION SELECT 26 UNION SELECT 27 UNIONSELECT 28 UNION SELECT 29 UNION SELECT 30 UNION SELECT 31 UNIONSELECT 32 UNION SELECT 33 UNION SELECT 34 UNION SELECT 35 UNIONSELECT 36 UNION SELECT 37 UNION SELECT 38 UNION SELECT 39 UNIONSELECT 40 UNION SELECT 41 UNION SELECT 42 UNION SELECT 43 UNIONSELECT 44 UNION SELECT 45 UNION SELECT 46 UNION SELECT 47 UNIONSELECT 48 UNION SELECT 49 UNION SELECT 50 UNION SELECT 51 UNIONSELECT 52 UNION SELECT 53 UNION SELECT 54 UNION SELECT 55 UNIONSELECT 56 UNION SELECT 57 UNION SELECT 58 UNION SELECT 59) AS seqWHERE DATE_ADD(#{startDate}, INTERVAL seq DAY) <= #{endDate}
),
occupied_dates AS (-- 查詢已被占用的日期SELECT DATE(check_in_date) AS start_date,DATE(check_out_date) AS end_date,TIME(check_out_time) AS checkout_timeFROM zyf_room_orderWHERE room_id = #{roomId}AND order_status IN ('paid', 'checked_in', 'checked_out')AND (-- 訂單影響查詢時間段的任何部分(DATE(check_out_date) >= #{startDate} AND DATE(check_in_date) <= #{endDate})OR-- 已入住未退房的長期訂單(check_out_time IS NULL AND DATE(check_in_date) <= #{endDate}))
)
SELECT ds.date,CASE -- 檢查該日期是否被占用WHEN EXISTS (SELECT 1 FROM occupied_dates od WHERE ds.date >= od.start_date AND ds.date <= od.end_dateAND (-- 如果是退房日,且退房時間>14:00,則不算占用NOT (ds.date = od.end_date AND TIME(od.checkout_time) > '14:00:00'))) THEN 0  -- 已預定ELSE 1     -- 可訂END AS status
FROM date_series ds
ORDER BY ds.date;

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/diannao/79724.shtml
繁體地址,請注明出處:http://hk.pswp.cn/diannao/79724.shtml
英文地址,請注明出處:http://en.pswp.cn/diannao/79724.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

Django 實現服務器主動給客戶端發送消息的幾種常見方式及其區別

Django Channels 原理 &#xff1a;Django Channels 是 Django 的一個擴展&#xff0c;它通過使用 WebSockets 等協議來處理長連接&#xff0c;使服務器能夠與客戶端建立持久連接&#xff0c;從而實現雙向通信。一旦連接建立&#xff0c;服務器可以隨時主動向客戶端發送消息。…

PHP最新好看UI個人引導頁網頁源碼

PHP最新好看UI個人引導頁網頁源碼 采用PHP、HTML、CSS及JavaScript等前端技術&#xff0c;構建了一個既美觀又實用的個人主頁解決方案。 源碼設計初衷在于提供一個高度可定制、跨平臺兼容的模板&#xff0c;讓用戶無需深厚的編程基礎&#xff0c;即可快速搭建出專業且富有創意的…

HarmonyOS學習 實驗九:@State和@Prop裝飾器的使用方法

HarmonyOS應用開發&#xff1a;父子組件狀態管理實驗報告 引言 在HarmonyOS應用開發領域&#xff0c;組件之間的狀態管理是一個至關重要的概念。通過有效的狀態管理&#xff0c;我們可以確保應用的數據流動清晰、可預測&#xff0c;從而提升應用的穩定性和可維護性。本次實驗…

12.第二階段x64游戲實戰-遠程調試

免責聲明&#xff1a;內容僅供學習參考&#xff0c;請合法利用知識&#xff0c;禁止進行違法犯罪活動&#xff01; 本次游戲沒法給 內容參考于&#xff1a;微塵網絡安全 上一個內容&#xff1a;11.第二階段x64游戲實戰-框架代碼細節優化 本次寫的內容是關于調試、排錯相關的…

c++基礎三

1.繼承 繼承表示,子類可以獲取父類的屬性和方法,然后可以寫子類獨有的屬性和方法,或者修改父類的方法。類可以繼承父類的公共成員(public),但不能繼承私有成員(private),私有成員只能在父類內部訪問。 1.1 案例一單繼承 #include <iostream>using namespace …

JSON學習筆記

文章目錄 1. JSON是什么2. JSON的特點與結構3. JSON的使用4. JSON文件讀取 1. JSON是什么 JSON&#xff08;JavaScript Object Notation&#xff0c;JavaScript對象表示法&#xff09;是一種輕量級的數據交換格式&#xff0c;易于人閱讀和編寫&#xff0c;同時也易于機器解析和…

王牌學院,25西電通信工程學院(考研錄取情況)

1、通信工程學院各個方向 2、通信工程學院近三年復試分數線對比 學長、學姐分析 由表可看出&#xff1a; 1、信息與通信工程25年相較于24年上升5分、軍隊指揮學25年相較于24年上升30分 2、新一代電子信息技術&#xff08;專碩&#xff09;25年相較于24年下降25分、通信工程&…

WPF依賴注入IHostApplicationLifetime關閉程序

WPF依賴注入IHostApplicationLifetime關閉程序 使用Application.Current.Shutdown();退出會報異常 應該使用 app.Dispatcher.InvokeShutdown(); Application.Current.Shutdown();app.Dispatcher.InvokeShutdown();static App app new();[STAThread]public static void Main(…

Jenkins 代理自動化-dotnet程序

兩種方式 容器部署 本地部署 容器部署 可自動實現&#xff0c;服務器重啟&#xff0c;容器自動運行 主要將dockerfile 寫好 本地部署 1.服務器重啟自動運行代理 參考下面的鏈接&#xff0c;只是把程序換成 java程序&#xff0c;提前確認好需要的jdk版本 Ubuntu20.04 設置開機…

從Archery到NineData:積加科技驅動數據庫研發效能與數據安全雙升級

積加科技作為國內領先的企業級數字化解決方案服務商&#xff0c;依托自研的 A4X 數字化平臺&#xff08;https://a4x.io/&#xff09;&#xff0c;專注于為全球范圍內的視覺物聯網&#xff08;IoT&#xff09;設備提供 PaaS/SaaS 服務。致力于運用 AI 技術賦能物聯網世界的各類…

SpringBoot整合Logback日志框架深度實踐

一、依賴與默認集成機制 SpringBoot從2.x版本開始默認集成Logback日志框架,無需手動添加額外依賴。當項目引入spring-boot-starter-web時,該組件已包含spring-boot-starter-logging,其底層實現基于Logback+SLF4J組合。這種設計使得開發者只需關注業務日志的輸出規則,無需處…

自由學習記錄(56)

從貼圖空間&#xff08;texture space&#xff09;將值還原到切線空間&#xff08;tangent space&#xff09;向量 tangentNormal.xy (packedNormal.xy * 2 - 1) * _BumpScale; 背后的知識點&#xff1a;法線貼圖中的 RGB 是在 0~1 范圍內編碼的向量 所以貼圖法線是怎么“壓…

【mysql】mysql疑難問題:實際場景解釋什么是排它鎖 當前讀 快照讀

注&#xff1a; 理解本文 前置需要掌握的基礎知識&#xff1a;事務隔離、鎖的概念、并發知識&#xff1b; 事務隔離 尤其是事務延伸問題 是個重難點&#xff0c;絕非八股文那幾句話就能說完的&#xff0c;在實際場景中&#xff0c;分析起來有一定難度 author: csdn博主 孟秋與你…

Python:使用web框架Flask搭建網站

Date: 2025.04.19 20:30:43 author: lijianzhan Flask 是一個輕量級的 Python Web 開發框架&#xff0c;以簡潔靈活著稱&#xff0c;適合快速構建中小型 Web 應用或 API 服務。以下是 Flask 的核心概念、使用方法和實踐指南 Flask 的核心特點&#xff1a; 輕量級 核心代碼僅約…

層次式架構核心:中間層的功能、優勢與技術選型全解析

層次式架構中的中間層是整個架構的核心樞紐&#xff0c;承擔著多種重要職責&#xff0c;在功能實現、優勢體現以及技術選型等方面都有豐富的內容&#xff0c;以下為你詳細介紹&#xff1a; 一、功能 1.業務邏輯處理 復雜規則運算&#xff1a;在許多企業級應用中&#xff0c;…

網絡--應用層自定義協議與序列化

目錄 4-1 應用層 4-2 重新理解 read、write、recv、send 和 tcp 為什么支持全雙工 4-3 開始實現 4-1 應用層 我們程序員寫的一個個解決我們實際問題 , 滿足我們日常需求的網絡程序 , 都是在應用 層 . 再談 " 協議 " 協議是一種 " 約定 ". socke…

fastlio用mid360錄制的bag包離線建圖,提示消息類型錯誤

我用mid360錄制的bag包&#xff0c;激光雷達的數據類型是sensor_msgs::PointCloud2&#xff0c;但是運行fast_lio中的mid360 launch文件&#xff0c;會報錯&#xff08;沒截圖&#xff09;&#xff0c;顯示無法從livox_ros_driver2::CustomMsg轉換到sensor_msgs::PointCloud2。…

C# WinForm窗口TextBox控件只能輸入數字(包括小數)并且恢復Ctrl+C復制和Ctrl+V粘貼功能

1. 前言 最近在寫定GPS定位時&#xff0c;經緯度是用的double類型&#xff0c;并且經緯度的要求是小數點后最少6位&#xff0c;多了能達到17位&#xff0c;又遇到了常用的TextBox控件只能輸入數字、小數的功能&#xff0c;因為有一年多沒有寫程序&#xff0c;現在再來寫這些感…

【MySQL數據庫】數據類型

目錄 1&#xff0c;數據類型分類 2&#xff0c;bit類型 3&#xff0c;小數類型 3-1&#xff0c;float/double類型 3-2&#xff0c;decimal類型 4&#xff0c;字符串類型 4-1&#xff0c;char 4-2&#xff0c;varchar 5&#xff0c;日期和時間類型 6&#xff0c;enum和…

Spark-SQL核心編程2

路徑問題 相對路徑與絕對路徑&#xff1a;建議使用絕對路徑&#xff0c;避免復制粘貼導致的錯誤&#xff0c;必要時將斜杠改為雙反斜杠。 數據處理與展示 SQL 風格語法&#xff1a;創建臨時視圖并使用 SQL 風格語法查詢數據。 DSL 風格語法&#xff1a;使用 DSL 風格語法查詢…