11-20 公司项目过程中遇到的问题

文章目录13.Array..请求头带不上数据（暂且不懂）15.vue父子组件通信方式详解以及vue报错 "" not .CSS巧妙实现分隔线的几种方法 17.HTML画分隔线18.日期选择器时间选择范围限制19.vue如何循环渲染-ui中table内容20.v-if与默认样式间的小问题
一、前言
卑微小前端开始工作了。开始记录一下自己在工作中遇到的问题，有些是粗心出的错，有些是基础不扎实遇到的问题。有些则是真的不知道有这种操作才出现的问题。总之就记录自己的在公司项目中遇到的各式各样的问题。也算是记录一下自己的成长。也方便自己之后遇到相同问题的时候。可以直接来自己博客找。大部分内容都源自别人写的博客，算是个缝合怪。。。。嘛。。起码我这东西还是自己试过可行的。
二、内容 11.js报错： read‘’ of null问题
在使用时，在图表元素并未加载的情况下进行.init（）,会发生此错误，因为并未找到该元素，故无法对其进行渲染。
解决方案：
1.查看填写的id是否真实存在，若不存在，当然无法根据来找到该元素；
2.将js文件放在html代码的后部；
拓展：
不仅是在时，只要是出现对元素操作时均有可能报此错误，表示未找到指定的元素。
我看你这个表格的初始化在的时候，通过调用this.();来实现的，但是你的这时候不在页面节点中，因为为false,所以初始化不成功。初始化的时候，节点一定要是在页面中真实存在的。
12.Vue中使用
由于在项目中需要对数据进行可视化处理，也就是用图表展示，众所周知是非常强大的插件。一开始想在网上找一个基于vue封装好的（懒省事），eg:vue-，但是拉取下来发现，跟项目中使用的类型有点偏差，而且他们的数据大多都是定制好的，我很难在此基础上进行更改（惹不起），于是选择了放弃，最终还是选择。以下是我使用的一些心得体会~
我的示例是在vue-cli搭建
安装依赖
npm-S
或者使用淘宝的镜像
npm-g cnpm --=
cnpm-S
创建图表
首先需要全局引入
在main.js中
// 引入
from ‘’
Vue..$ =
在.vue中
export default {name: 'hello',data () {return {msg: 'Welcome to Your Vue.js App'}},mounted(){this.drawLine();},methods: {drawLine(){// 基于准备好的dom，初始化echarts实例let myChart = this.$echarts.init(document.getElementById('myChart'))// 绘制图表myChart.setOption({title: { text: '在Vue中使用echarts' },tooltip: {},xAxis: {data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]},yAxis: {},series: [{name: '销量',type: 'bar',data: [5, 20, 36, 10, 10, 20]}]});}}}
注意：我们要在生命周期函数中实例化对象。因为我们要确保dom元素已经挂载到页面中

文章插图
image.png
这样一个简单的图表就完成了，是不是觉得很简单？假如在一个大型的项目中，而且数据是非常复杂的？那么该如何操作？
按需引入
由于全局引入会将所有的图表打包，导致体积过大
在.vue文件中

// 引入基本模板let echarts = require('echarts/lib/echarts')// 引入柱状图组件require('echarts/lib/chart/bar')// 引入提示框和title组件require('echarts/lib/component/tooltip')require('echarts/lib/component/title')

使用而不是
基于前面的疑问，加上实际运用到项目中遇到的一些问题，我思考使用组件的形式。
以组件的形式用