vue-watch如何监听非DOM元素的事件

 vue-watch监听非dom元素的事件

1.通过键盘监听事件完成姓名的拼写监听的是dom元素中的事件，是用户操作直接的事件。而watch可以监视路由等非dom元素的事件。

2.watch监视非dom元素事件，只需将本实例中的firstname2属性名字符串换成 '$route.path' 变量名即可，注意单引号

3.单引号的使用规则：一、字符串中带有英文连字符使用，不能使用有些驼峰原则的时候 二、本来都要使用单引号的，没有使用连字符的字符串名字直接省略 三、变量一定要使用单引号

html代码：

<script src="../lib/vue.js"></script>

+ =

+ =

<script> var vm = new vue({ el:'#app', data:{ firstname:'', lastname:'', fullname:'', firstname2:'', lastname2:'', fullname2:'' }, methods:{ getfullname(){ this.fullname = this.firstname + '·' + this.lastname } }, watch:{ firstname2: function (newval){ this.fullname2 = newval + '·' + this.lastname2; }, lastname2: function (newval) { this.fullname2 = this.firstname2 + '·'+ newval; } //function有两个参数，一个newval表示最新的字符串，oldval表示原有的字符串 } //监听data中的数据变化，触发对应的处理函数 }) </script>

效果;