vue2项目中遇到的问题汇总

华为内置浏览器打不开vue2页面如何调试:

用iE浏览器的 edge版本,检查报错,一个错都不能有,全部清除报错 不兼容问题后,  华为就打开了!

1、IE9中, 请求服务器数据并用v-for渲染option标签出现只显示第一个字的问题


2、IE9中,elementUI的el-input删除操作无法触发数据变动监听

解决办法:

        加入ie9input事件  cnpm install --save ie9-oninput-polyfill

3、vue自定义指令判断时机问题


因为无法控制标签内容的渲染时机导致判断出错,所以应该去判断value

4、el-input手动获取焦点问题

情景:输入框一开始是隐藏的,点击按钮显示输入框并获取焦点

把手动获取焦点那段代码写在$nextTick()就好了

手动获取焦点这个操作我也记录一下:

首先给标签加个属性ref="searchBox"(名字随便起),然后点击按钮把控制显示的字段赋值true,接着写下这几行代码就好了


5、mounted钩子函数中请求数据导致页面闪屏问题

    解决办法:

            其实就是加载时机问题,放在created里会比mounted触发早一点,如果在页面挂载完之前请求完成的话就不会看到闪屏了

6、IE9中template标签使用问题

解决办法:

        之前在tr标签里面用template标签包裹td标签,出现了比较严重的UI错乱,

        所以。。。IE9不能在tr标签中使用template标签

7、纯色svg转换成字体(用了panda这个软件),跟预期不符

        这个应该是跟svg的描绘路径什么的有关

8、一个奇葩bug,开发环境elementUI的表格排序图标不显示,但是在线上环境和其他同事的开发环境没问题

// 是由于mac没安装xcode导致依赖包install出错(出错了居然还能启动。。)

// 输入以下命令,如果没安装xcode系统就会提示你安装了

// npm rebuild node-sass --force

后来又出现了问题, 然后我升级了npm版本解决

9、el-table用v-if隐藏显示列和预期不符问题

    解决方法:

          给el-table-column加一个key属性,:key="Math.random()"或者其他的,确保每列的key值不同就可以了

10、在使用el-table的时候有的时候需要对表格中的数据做处理,需要用到filter,虽然官方也有提供过滤的方法(filter-method),但是还是用自定义列,然后用filter复用性好一些


11、在使用el-table的时候,有时候需要自定义表头,比如在表头中加个问号,然后hover有个提示信息

这里就需要用到官方提供的render-header属性了,首先给需要自定义表头的列加一个属性,绑定一个方法

HTML:


methods:


12、用forEach遍历NodeList,报错“TypeError为对象,不支持forEach属性”

你可能感兴趣的:(vue2项目中遇到的问题汇总)