vue中,在页面加载完成后,JS再写入带@click的HTML代码,此时如何让@click...
发布网友
发布时间：2022-04-24 10:31
我来回答
共1个回答
热心网友
时间：2022-04-21 17:40
直接在methods方法里面写你的点击事件函数
html
<template v-for="(item, index) in questionnaireList">
<div class="questionnaire-section" @click="onSection(item.id)">
<div class="title">{{item.title}}</div>
</div>
</template>
js
var app = new Vue({
el: '#app',
data: {
questionnaireList: [], //定义一个空数组
currentPage: 1, //当前页
},
//加载完后自动执行
mounted:function(){
var that = this;
that.questionnaireData(); //调用方法
},
methods: {
questionnaireData:function () {
var that = this;
$.ajax({
url: url + "questionnaire",
type: "GET",
data:{
currPage: that.currentPage
},
success:function (res) {
res.data.questions.map(function (item,index) {
that.questionnaireList.push(item);
});
}
});
},
//绑定的点击事件
onSection:function (id) {
console.log("你当前点击的栏目对应id是： " + id);
},
}
});
追问这涉及到后端异步，虽然没回答正点，不过还是谢谢你的回答
vue中,在页面加载完成后,JS再写入带@click的HTML代码,此时如何让@click...
var app = new Vue({ el: '#app', data: { questionnaireList: [], //定义一个空数组 currentPage: 1, //当前页 }, //加载完后自动执行 mounted:function(){ var that = this; that.questionnaireData(); //调用方法 }, methods: { questionnaireD...
VUE3 之 click 事件
首先，click事件的应用十分广泛。例如，我们可以利用它实现数字递减功能，每次点击按钮，商品库存自动减1，直观且便捷。在事件方法中，不仅能处理点击动作，还能获取event对象，获取关于事件的详细信息。事件方法并非一成不变，比如decr函数，通过增加参数n，可以根据具体需求进行灵活计算。此外，click事件允许在...
vue的点击事件;如何添加vue的click
给点击按钮添加vue的点击事件。在点击按钮标签里面添加上@click="test"即可。保存html代码，然后使用浏览器进行打开，在浏览器页面点击按钮事件，这个时候就可以看浏览器上弹出一个alert弹出框，表示vue点击事件已成功执行。所有代码。可以直接复制所有代码到新建html代码页面，然后修改引入vue.js的...
vuenative?
三、app.vue初始化websocket 四、vuex分发消息 五、子页面获取websoket返回的信息(监听到了时间戳的改变)vue中的.native修饰符如果你想在某个组件的根元素上绑定事件，直接使用@click=''function'是不生效的，我们可以添加.native修饰符@click.native=''function''。上demo:测试下发现这里的点击事件handle...
在vue中能够实现页面单击事件绑定的代码是
vonclick。在Vue中，可以使用von指令来绑定事件，其中click事件用于处理单击行为。通过在元素上使用vonclick，可以指定当该元素被单击时要执行的函数或方法。
vue 的点击事件怎么获取当前点击的元素
一、首先，在编辑器中创建一个web项目，并在目录中创建一个新的静态页面buttonclick.html：二、然后在title标签中介绍准备好的vue.js库文件。在这里，将JS文件放在JS目录中，然后在body标记中插入一个div和四个按钮，将click事件与Vue中的v-on标记绑定：三、接下来，插入脚本标记，在标记中写入事件函数...
vue中如何实现后台管理系统的权限控制的方法步骤
接下来我们编写一个vue自定义指令对页面中需要进行鉴权的元素进行判断,比如类似这样的:<a @click="upload" v-allow="'3'"></a> /* 3代表一个上传权限的ID,权限中有3则显示按钮 */我们直接注册一个全局指令,利用vnode来访问vue的方法。代码如下://main.js//按扭权限指令Vue.directive('allow', { ...
vue中的strings must use singlequote是什么意思
第一种解决方法：用代码来说明：var body = "result=" + JSON.stringify(g_answer)；字符串中的双引号改为单引号：var body = 'result=' + JSON.stringify(g_answer)；第二种解决方法：在报错的JS文件中报错的代码上写上：/* eslint-disable */ 只要添加/* eslint-disable */，本文件中在...
Vue3中的router-link
在Vue3中，采用的是4版本的路由，此版本中router-link已不再具备tag属性，仅能被编译成a标签形式。若欲使用其他标签进行路由跳转，需采取替代方法。替代方式之一，可直接利用点击事件切换路由，通过@click指令搭配$router.replace方法，实现所需功能。具体操作中，需确保所有属性正确无误，以确保路由跳转顺利...
详解如何在Vue里建立长按指令
首先,我将解释如何在VanillaJS中实现这一目标。然后,为它创建一个Vue指令。那么,让我们开始吧。原理为了实现长按,用户需要按住按钮几秒钟。要在代码中复制它,我们需要在按下鼠标“单击”按钮时监听,启动计时器,不管我们希望用户在执行函数之前按住按钮,并在时间设置之后执行该功能。非常简单!但是,我们需要知道用户...
