1.用户输入传递问题
当两个相似的页面需要根据用户事件切换显示的时候，会出现用户输入内容传递的情况，比如一个input切换到另一个input时（这两个不同时显示，一个显示则另一个消失），由于Vue出于性能的设计，在渲染真实dom之前，在虚拟dom中会尽可能的复用。虽然其他不同的都会被重新设置，但是用户输入的内容并没有，所以出现了传递的现象。
解决方案是加一个key='XXX' 两个相同标签加不同的key，即可不使用复用，从而解决这个问题
2.模板中需要传参
有时候我们会定义一个常量数组在data中，模板中去访问时需要根据下标去访问，若不能采取v-for的方式写模板则不能正确的取到值。此时，可是使用计算属性，计算属性本身不能接受传参（即使在模板中写类似{{titles(0)}}这样的， 0 也不会传入计算属性的参数中，计算属性是属性，属性没有参数的概念），但是我们可以利用计算属性的特性，返回一个函数，这样再使用的时候就可以通过调用函数的方式传参了。
<div> {{titles[0]}} </div>
computed:{
titles(){
return (index) => return this.dataArr[index];
}
}
如上{{titles(0)}}中的0才会是函数调用的参数，否则会被识别为一个名称是titles(0)的变量，又没有这样的变量/计算属性，所以这里的值是undefined。
3.数据匹配
不确定是字符串或数字，如何写判断条件
eg:
a+= ''
先转字符串再用字符串比较
也可以转数字，但是注意parseInt可能的NAN 或者丢失如123abc会转成123，abc丢失了，所以用字符串更好一点
如果是转数字，则使用Number('数字') 更好，如果不能转则返回NAN
注意：
如果只是判断true/false 则使用!!a更为快捷
4.引入子模块名称/其他名称
尽量使用模块名称简写+cmp的形式，比如timecmp，以防和变量名/关键字等冲突，导致页面异常的情况，最可能的异常是页面不显示，元素审查也只能看到0*0，设置样式也无效
5.env文件添加内容
1.添加的内容必须重新npm run serve才生效
2.添加的内容个格式十分严格，中间不能有空格VUE_APP_TEST=XXX不能写成VUE_APP_TEST = XXX
网友评论