模板字符串使用點擊事件【VUE3】

項目場景:

提示:這里簡述項目相關背景:

項目中使用模板字符串的時候很多,有些時候需要再模板字符串中使用點擊事件,那么在模板字符串中可以使用點擊事件么?如果這個點擊事件需要傳參呢?

答案是肯定的,那么具體怎么綁定點擊事件又該怎么傳參呢?

  • 在模板字符串中綁定點擊事件要用 onclick ='goDetails()'
  • 在onMounted鉤子里面掛載在window上onMounted(() => { window["goDetails"] = goDetails;});
  • 總結:為什么需要定義window.getDownUp = this.getDownUp?

    1.在字符串里的點擊事件是原生的onclick
    2.原生的函數getDownUp是定義在window全局對象上的

  • 然后使用這個定義好的點擊事件?const goDetails=(val)=>{......}


原因分析:

提示:這里填寫問題的分析:

?但是在傳參的時候,單獨傳參是ok傳對象會報錯

這是因為傳的是變量,將變量轉成字符串對象就可以了

onclick ='goDetails(${JSON.stringify(item)})'


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

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

相關文章

AI——DeepSeek+LangChain+streamlit 實現智能汽車維修服務

效果圖 分析流程 代碼實現 廢話少說,直接上代碼 from langchain_core.language_models.llms import BaseLLM from langchain_core.outputs import Generation, LLMResult from pydantic.v1 import Field, validator from typing import Any, Dict, List, Optional…

《C++ 繼承》

目錄 繼承的定義 繼承類模板 派生類和基類之前的轉換 隱藏 派生類的默認成員函數 不能被繼承的類 繼承中的友元和靜態成員 繼承模型 繼承的定義 繼承的本質是一種復用。規定Person類為基類,Student類為派生類 。 繼承方式分為public繼承,prote…

金蝶K3 ERP 跨網段訪問服務器卡頓問題排查和解決方法

我一朋友公司反應,公司網絡卡頓,測試掉包嚴重,抓包wireshark測試,發現arp包有大量mac欺騙,因為公司有幾百臺電腦,所以建議更換了三層交換機,劃分了vlan,這樣有效的避免了網絡風暴等&…

無需安裝!在線數據庫工具 :實戰 SQL 語句經典案例

在數字化時代,SQL(結構化查詢語言)已成為數據從業者、開發人員乃至業務分析人員必備的核心技能。無論是處理日常數據報表,還是應對復雜的業務邏輯,SQL 都能高效實現數據的查詢、操作與分析。本文將通過經典的 SQL 練習…

如何在網頁里填寫 PDF下拉框

對于PDF 開發者或網頁開發者來說,讓用戶在網站上填寫 PDF 下拉框(Combo Box)是一個棘手的問題。因為 PDF 并不是一種原生的 Web 格式,瀏覽器通常不允許用戶與 PDF 下拉框進行交互。 那么,如何讓用戶在 HTML 中填寫 PD…

.Net 優秀框架 ABP全面詳解

文章目錄 第一部分:ABP框架概述與核心架構1.1 ABP框架簡介1.2 ABP框架架構解析1.2.1 表現層(Presentation Layer)1.2.2 分布式服務層(Distributed Service Layer)1.2.3 應用層(Application Layer)1.2.4 領域層(Domain Layer)1.2.5 基礎設施層(Infrastructure Layer)…

力扣-198.打家劫舍

題目描述 你是一個專業的小偷,計劃偷竊沿街的房屋。每間房內都藏有一定的現金,影響你偷竊的唯一制約因素就是相鄰的房屋裝有相互連通的防盜系統,如果兩間相鄰的房屋在同一晚上被小偷闖入,系統會自動報警。 給定一個代表每個房屋…

windows 安裝vllm cuda版本

windows 安裝cuda版本 查看window cuda版本 nvidia-smi vllm 獲取鏡像,此版本需要cuda 版本12.8 或以上 docker pull vllm/vllm-openai:latest下載模型 git lfs installcd e:\ai mkdir vllm\models\qwen2cd vllm\models#通過git下載git clone https://www.modelscope.c…

Node.js特訓專欄-基礎篇:1. Node.js環境搭建與項目初始化詳細指南

我將為你詳細講解 Node.js 環境搭建與項目初始化的步驟,包含常見問題解決和最佳實踐,幫助你快速上手。 詳細步驟說明 1. 環境搭建 Windows用戶: 訪問Node.js官網(https://nodejs.org)下載LTS版本安裝包(推薦長期支持版&#xf…

13.安卓逆向2-frida hook技術-HookJava構造方法

免責聲明:內容僅供學習參考,請合法利用知識,禁止進行違法犯罪活動! 內容參考于:圖靈Python學院 工具下載: 鏈接:https://pan.baidu.com/s/1bb8NhJc9eTuLzQr39lF55Q?pwdzy89 提取碼&#xff1…

php基礎:常見函數

內建函數 文章目錄 內建函數1、文件操作函數:2、代碼執行函數:3、反序列化函數:4、數據庫操作函數:5、類型轉換與比較函數:6、其他常見函數: 1、文件操作函數: include(): 導入并執行指定的 PHP…

教程:PyCharm 中搭建多級隔離的 Poetry 環境(從 Anaconda 到項目專屬.venv)

核心思維:為什么需要 “多級隔離”? 在復雜項目中,環境沖突是最棘手的問題(比如系統 Python 版本不同、依賴包版本沖突)。通過 “Anaconda 虛擬環境 → 項目 Poetry 環境 → 工具級隔離” 的三層架構,實現…

Rollup vs Webpack 深度對比:前端構建工具終極指南

前端工程領域始終面臨一個根本選擇:如何在模塊化編碼規范與工程化構建效率之間取得最佳平衡。Rollup與Webpack分別代表著兩種不同維度的解決方案,本文將揭示它們的真實應用場景與核心差異。 一、核心差異全景圖(附最新對比) 核心能…

Module Federation 和 Native Federation 的比較

前言 Module Federation 是 Webpack 5 引入的微前端架構方案,允許不同獨立構建的應用在運行時動態共享模塊。 Native Federation 是 Angular 官方基于 Module Federation 理念實現的專為 Angular 優化的微前端方案。 概念解析 Module Federation (模塊聯邦) Modul…

Easy Excel

Easy Excel 一、依賴引入二、基本使用1. 定義實體類(導入/導出共用)2. 寫 Excel3. 讀 Excel 三、常用注解說明(完整列表)四、進階:自定義轉換器(Converter) 其它自定義轉換器沒生效 Easy Excel在…

iOS 26 攜眾系統重磅更新,但“蘋果智能”仍與國行無緣

美國西海岸的夏天,再次被蘋果點燃。一年一度的全球開發者大會 WWDC25 如期而至,這不僅是開發者的盛宴,更是全球數億蘋果用戶翹首以盼的科技春晚。今年,蘋果依舊為我們帶來了全家桶式的系統更新,包括 iOS 26、iPadOS 26…

AI高考志愿助手應用架構設計并上線實施運行

環境: AI高考志愿助手 問題描述: AI高考志愿助手應用架構設計并上線實施運行 業務需求:開發一個AI升學助手,功能是幫助用戶模擬填報高考志愿等功能,數據是歷年各專業的錄取分數線表格。數據確認: 近3年約100多萬條數據,原始數據是excel表格數據。解決方案: 一、項…

深入淺出掌握 Axios(持續更新)

在了解ajax和axios之前,我們先觀察一下他們是什么英文的縮寫 ajax 的名字為 asynchroanous JavaScript and XML 而axios的名稱來源于英文單詞“axis”與“I/O”的結合,并非直接縮寫自某個特定短語。 先導知識 在本文我們簡單的介紹一下ajax后著重講解…

windows10下搭建nfs服務器

windows10下搭建nfs服務器 有參考這篇博客 Windows10搭建NFS服務 - fuzidage - 博客園 下載 NFS Server這個app 通過網盤分享的文件:nfs1268 (1).exe 鏈接: https://pan.baidu.com/s/1rE4h710Uh-13kWGXvjkZzw 提取碼: mwa4 --來自百度網盤超級會員v5的分享 下載后…

npm符號鏈接

前言 最近在寫一個快應用項目,demo中依賴了本地文件,package.json如下: 此時 node_modules 下出現了 mysdk,復制整個項目,但是copy的項目中的node_modules并未出現該文件,導致報錯。 解決方案 觀察 pa…