vue @click传字符串

最新推荐文章于 2023-07-26 20:19:20 发布
转载 最新推荐文章于 2023-07-26 20:19:20 发布 · 1.4k 阅读 · 0 ·
CC 4.0 BY-SA版权
原文链接：http://www.cnblogs.com/linjiangxian/p/11460882.html
文章标签：

#javascript #ViewUI

本文介绍了在Vue.js中如何使用转译字符来正确地传递包含特殊字符的字符串到事件处理器。通过两种方法展示：直接传递和通过字符串变量传递。

参考： https://www.cnblogs.com/springlight/p/5782637.html

关键：使用转译字符 \ 来转译引号

方法一. 直接传递：

var tem = "<p @click='fun1(\'这里是传递的字符串\') '></p>"

方法二. 字符串变量型

var str = '111'
var tem = "<p @click='fun1(\'"+ stringParam  +"\') '></p>"

 

转载于:https://www.cnblogs.com/linjiangxian/p/11460882.html

Macdull2014
关注
vue中如何实现变量和字符串拼接
01-19
整理文档，搜刮出一个vue中如何实现变量和字符串拼接的代码，稍微整理精简一下做下分享。 在data中定义变量： data() { return { a: 'A' } } 如何通过按钮点击实现字符串和变量a的拼接呢？ <button @click='...
解决vue组件中click事件失效的问题
12-13
在Vuex中，mutations是唯一可以改变store状态的地方，且每个mutation必须有一个类型字符串作为第一个参数。例如，如果你要定义一个名为`changeCity`的mutation，正确的做法是： ```javascript const store = new ...
Vue 所有指令（v-on:click = @click v-blind:class = :class）的学习
写博客只为学习
04-11 3172
[color=blue][size=medium][b]先说一下指令里面的值都是表达式[/b][/size][/color] [code="js"]new Vue({ el: "#box", // element（元素） 当前作用域 id="box" data(){ return { //用return返回对象 ...
记录在JS的onclick事件中传入字符串类型的参数小问题
从零开始的异世界JAVA学习
01-13 734
在做某个练习时,这次删除调用的函数需要传递几个参数; 没注意到我这里传递的第三个参数是字符串; 就一直点啊点,它就是报错; 这里传参的时候注意;字符串类型的参数需要转义; str += "<a href='javaScript:void(0)' οnclick='toDelete(" + res.data[i].id+","+ res.data[i].writerId+",\""+res.data[i].title+"\")'>删除</a>"; ...
vue3 中模板字符串中添加click方法并传参
qq_19249021的博客
07-26 2793
vue模板字符串添加click并传参
在vue中使用字符串模板拼接的点击事件@click时点击事件失效
茉莉蜜茶~~~
12-16 3116
在vue中使用字符串模板拼接的点击事件@click时，点击事件失效 处理办法 1.将@click 改成onClick str = `<p class="riskType"><strong>风险点：</strong> <a onClick="riskBox('${item.riskContent}','${item.riskTypeName}')">审查建议</a></p>` 2、在生命周期mounted中赋值方法给window对象，
vue中使用@click进行传参
weixin_53815644的博客
05-06 9404
在右侧操作栏添加按钮并将该行信息（id）传递到方法中 1.template中必须使用slot-scope="scope" 才能在方法handleCount中使用scope.row进行传参 </template> <template slot="menu" slot-scope="scope"> <el-button type="text" icon="el-icon-circle-plus-outlin
vue实现在v-html的html字符串中绑定事件
10-16
在Vue.js中，v-html指令允许开发者将HTML字符串渲染到Vue模板中的元素里，这可以用于展示从服务器获取的HTML内容。但是，直接在v-html渲染的HTML字符串中添加事件监听器是不可行的，因为v-html插入的内容不会被Vue的...
vue中模板字符串添加@click事件
小水滴的博客
08-09 1997
vue中模板字符串添加@click事件
vue中在字符串中添加点击事件
white-hang的博客
12-27 5579
本文主要介绍如何在vue的字符串模板里处理点击事件
vue中传值的方法
czw2ly的博客
12-05 3413
主要是谈谈vue中组件传值的方法，供大家参考
vue中通过函数传参数
weixin_43989837的博客
03-18 9871
一，通过点击事件本身的js特性传参。 <view class="center_menu"> <view class="menu_item" v-for="item in menus" @click="toAddress(item.address)"> <image :src="item.icon" mode="aspectFill" ><...
vue——路由传参
cc_xxo的博客
03-05 421
通过query传参 传参方式一：字符串传参 <!-- 跳转路由并携带query参数，to的字符串写法 --> <router-link :to="`/home/message/detail?id=${message.id}&title=${message.title}`"> {{message.title}} </router-link> 传参方式二：对象传参 <!-- 跳转路由并携带query参数，to的对象写法 --> <router-l
Vue--click事件传递参数--方法/教程/实例
热门推荐
IT利刃出鞘的博客
11-08 6万+
原文网址： 简介 说明 本文用示例介绍Vue中事件传参的方法。 Vue的事件用法为：v-on:click="xxx"。可以用@click="xxx"来简写。 本处采用click这个事件进行展示，其他的事件也是一样的。 官网 事件处理 — Vue.js 只传自定义参数 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"&...
Vue 字符串转Function
ZYXW的博客
12-05 7297
#Vue 字符串转Function 方法一: eval /* 定义字符串类型方法 */ const func="(value)=>{console.log(value);return value}" /* 字符串转Function */ str_to_func(func,value){ return eval(func)(value) } /* 使用 */ str_to_func(...
vue组件属性中字符串如何拼接变量？
abcde158308的博客
04-20 2万+
&lt;a v-bind:href="'/forum/list/?id=' + id" &gt; 这样试一下呢,我刚才用vue2.0就这样拼接成功了
vue中参数传递（合集）
boy火巨的博客
09-10 2万+
前段时间项目用vue搭建整个前端页面，我负责的模块有个地方在页面跳转时得将参数传递到下一个页面，但是由于参数较多，用url带参数传递不是特别好，我尝试了多种方法想在页面之间传递参数都没成功，最后想到了vuex，当时又是刚开始学vue对vuex更是了解不多废了一点时间，好在问题解决了，下面分享我解决问题的代码，希望对大家有所帮助。 一.页面跳转通过路由带参数传递数据 // 1.页面中的代码 t...
vue 方法传参只能传字符串吗
最新发布
09-14
在Vue.js中，方法的传参并不限于字符串。你可以向方法传递任意类型的参数，包括数字、字符串、对象、数组甚至函数等。无论是通过模板内的事件处理器（如`v-on`或`@`监听器）还是通过组件的自定义事件传递参数，都可以传递复杂的对象或数据类型。 为了在事件处理器中传递参数，你可以直接在模板中指定参数值，或者使用`$event`来引用原生DOM事件。例如： ```html <!-- 直接传递字符串参数 --> <button @click="handleClick('这是一个字符串参数')">点击我</button> <!-- 使用$event来传递原生事件 --> <button @click="handleClick($event, '额外的参数')">点击我</button> <!-- 传递对象 --> <button @click="handleClick({key: 'value'})">点击我</button> ``` 在JavaScript代码中，你可以定义接收这些参数的方法： ```javascript methods: { handleClick(param1, param2) { console.log(param1, param2); // 这里可以根据需要处理参数 } } ``` 需要注意的是，在使用`v-on`或`@`监听器时，如果方法需要接收原生事件对象，你需要手动传递`$event`作为参数，因为Vue会将参数按顺序传递给方法。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值