1、父组件传递 props 到子组件过程中,报错或者没有值。
参考链接:http://www.jb51.net/article/117447.htm
2、vue工程项目中style设置background-image路径问题:
使用
<li v-for="img in imgs" :key="img.id" class="" :style="'background-image:url('+ img +')'"></li> imgs:[ require('./../assets/banner_top2.png'), require('./../assets/banner_top3.png'), require('./../assets/banner_top4.png') ]
3、刷新页面,vuex中全局变量state不能保存原有的数据,需要在给vuex中state赋值的同时,通过localStorage存储来代替。因为store里的数据是保存在运行内存中的,当页面刷新时,页面会重新加载vue实例,store里面的数据就会被重新赋值。
4、router-link中如果绑定了跳转路径:to,就不能添加click事件,不会执行。
- 解决办法:不用router-link直接使用a标签+@click事件,并在点击事件中添加this.$router.push来进行路由的跳转
5、子页面需要绑定后台数据到视图,获取数据函数传入参数需要从父级页面得到时。
- 解决方法:在父页面获取到数据后,保存在vuex中,在子页面的computed中获取得到数据即可。(页面刷新问题可看4)
6、父组件传递props异步数据到子组件,先获取数据,再加载子组件,用v-if绑定子组件,初始设置为false,然后再mounted钩子函数最后将值改为true,加载子组件。或者使用watch监听子组件加载。
7、子组件中用Echarts画图,图表数据从后台获取:
- 用上述方法,即使在父页面提前获取数据,仍然报错;仍然无法保证页面绘制图表时,数据已经获取到;
- 解决措施:在mounted钩子函数中获取数据,然后将图表绘制步骤放置到$http.get()方法的回调函数中,在正确获取到数据后再进行图表绘制,在computed中返回对应参数;
8、在@click事件中有个默认参数but($event,this),可以获取当前点击元素进行修改。
event.target.style.backgroundColor = 'red'.
9、页面刷新,vuex保存的数据消失的问题,除了将上级传入数据放到localStorage,或者用props传递参数。
10、 一般项目中,一个相对独立的模块如果引入vue用的话,
- 如果是单独的一个router-cli建立的工程,除了用url引入。
- 如果是直接在项目中嵌入,就在模块入口用新建vue实例,CDN方法引入vue。
11、 一个vue项目,vuex进行模块化管理,即除了根 store 以外,还通过 module 将各组件的 store 分开管理。或者每一个组件建立新的vuex文件存储。
12、页面刷新,若模板更新过多,出现很强烈的过度效果,可能是使用v-if的原因,可以用v-show代替。