element ui
vue事件监听
<div id="demo" @click="onClick">
<a >触发一个方法函数</a> </div> <script src="https://cdn.bootcss.com/vue/2.5.13/vue.js"></script> <script type="text/javascript"> new Vue({ el: '#demo', data: {}, methods: { onClick: function (e) { console.log(e); //MouseEvent {isTrusted: true, screenX: 115, screenY: 141, clientX: 107, clientY: 24, …} console.log(this); //Vue$3 {_uid: 0, _isVue: true, $options: {…}, _renderProxy: Proxy, _self: Vue$3, …} console.log(e.targetVM); //undefined console.log(e.target.tagName); // "A" console.log(e.targetVM === this); // false } } }) </script>
onClick后边无需跟(),点击事件发生时: 浏览器执行window.onclick(event)代码,此时onclick=onClick,相当于调用onClick(event),原生DOM event会被作为第一个参数传入,同时,这个event会带有targetVM 属性,指向触发该事件的相应的ViewModel
npm init -y → package.json (npm配置项)
clone的项目,已经有package.json(npm配置项):
① git clone https://github.com/ElementUI/element-starter.git //通过git,clone一个项目(注意路径)
② npm install //访问package.json(npm配置项),将项目的依赖下载下来,放到node_modules文件夹中
③ npm run dev //执行package.json→scripts→dev //读取webpack.config.js,对js/css进行编译打包
cmd / terminal 清屏 //cls (clears)