前端框架 VUE 开发问题总结

1. 页面属性渲染问题
   在 vue 的开发中, 我们最常用的是 vue 的双向绑定的属性，我们将属性定义在 data () { 属性名：属性默认值 } 中，同时在页面中使用 {{ this.属性名 }}，vue 在加载时会将默认值渲染到 {{ this.属性名 }} 中进行显示，当在 js 中通过 this.属性名 = XXX 进行修改值时，{{ this.属性名 }} 会被实时同步修改显示，如果在开发中遇到修改值，页面未同步改变问题时，需要排查当前 this 的指向问题，看当前的 this 是否指定的是全局的，这里推荐是用箭头函数： 方法名 = (传入参数值) => { this.属性名 = xxx } 的方式进行修改，在此箭头函数中 this 永远指向的是全局的。如果还是遇到无法同步渲染的问题，就需要排查定义的属性，修改的属性，页面显示的属性是否大小写一致，是否完全相同等。
2. 集合修改其中一项的值，页面未同步渲染问题
   我们在 vue 的开发中往往需要修改集合中某一项的值，如:下拉框的选中属性，当我们将集合中的其中一项进行修改后，js 通过 log 输出的值发生改变，页面显示却无变化时，我们可以使用 this.$ set() 方法进行渲染集合，此方法的语法如下：this.$ set(this.需要修改的集合，集合中需要修改项的下标，修改项的值) 通过此方法，集合中的参数发生变化时，页面也会进行同步渲染。