<!DOCTYPE html><html><head><meta charset="UTF-8"><title>双向数据绑定和事件绑定</title></head><body><div id="app"><p>{{msg}}</p><input v-model="msg"><button onclick="alert('msg='+vm.msg)">点我看看1</button><button v-on:click="alert('msg='+this.msg)">点我看看2</button> <button v-on:click="handleClick">点我看看3</button></div><script src="./libs/vue.js"></script><script type="text/javascript">var vm = new Vue({el:"#app",data:{msg:'Hello,How are you?'},methods:{handleClick:function(){alert('msg='+this.msg)}}})</script></body></html>上面代码，只有这一句<button v-on:click="alert('msg='+this.msg)">点我看看2</button> 总是报错，不知道为什么？谢谢回答
1 回答
橋本奈奈未
TA贡献436条经验 获得超108个赞
这个报错是vue给你的一个提示，vue检测到你使用的alert函数并没有在实例中定义，你预期是希望它指向的是window.alert，但是vue并不能知道是不是因为你忘记定义了实例属性或方法，所以它给你一个错误提示，因为这可能会引起问题，如果你使用的是移除了错误提示和警告的压缩版的vue，比如vue.min.js，那么这段代码就可以执行了【前提是this.msg要改为msg，这里使用this是有问题的】，完整版的vue会做很多这样的错误提示，这是在帮助开发者规避一些意外错误。最好不要内联代码，还是定义一个方法去执行比较好。
添加回答
举报
0/150
提交
取消