vue.js使用过程遇到的问题

1.在刚开始使用vue的时候,事件是用jquery写的,其中事件包含在vue的div中,当vue初始化以后,事件照常运行 

var init=[{
				id:1,
				name: '成人票',
				price: 100
			}, {
				id:2,
				name: '儿童票',
				price: 60
			}, {
				id:3,
				name: '半价票',
				price: 50
			}];
	var tabstr='';
	var total='';
	var jsn='';
	var all = new Vue({
		el: '#all',
		data: {
			tickets: init
		}
	});
	app = new Vue({
		el: '#app',
		data: {
			tickets: ''
		}
	});
	$('.numbtn').children('#sub').click(function() {
		tabstr='';
		var inp = $(this).parent('div').find('input');
		var num = parseInt($(this).parent('div').find('input').val());
		num--;
		if(num >= 0) {
			inp.val(num);
		} else {
			inp.val(0);
		}
		tab();
	})

 

但是当用ajax从后台取到数据,修改vue中的data的时候(all.tickets = “”),问题就出现了,div包含的事件全部不起作用了,查阅资料发现vue会重新绑定事件,解决办法,将事件写在vue的methods中。

2.vue获取点击的元素

<button type="button" id="sub" v-on:click="sub($event)">-</button>
sub: function(event) {
            tabstr = '';
            var inp = $(event.target).parent('div').find('input');
            var num = parseInt($(event.target).parent('div').find('input').val());
            num--;
            if(num >= 0) {
                inp.val(num);
            } else {
                inp.val(0);
            }
            this.tab();
        }

html中入参写$event,$(event.target)取到的就是该元素

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值