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)