文章目录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')
使用而不是
基于前面的疑问,加上实际运用到项目中遇到的一些问题,我思考使用组件的形式 。
以组件的形式用
- 可怕的黑产 一DDoS公司两年赚6百万美金
- 许昌房产中介公司,许昌锐意文化传播有限公司介绍?
- 许昌远东传动轴吧,许昌远东传动轴有限公司介绍?
- 重磅发布!全球最具创新力公司,中国企业两家入围,华为和比亚迪 华为中国之最
- 计算机软件公司排名,电脑*软件排行
- idea 创建java web项目_使用IDEA创建javaweb项目
- 微前端的现状以及趋势
- 郑成功收复台湾的结局:荷兰东印度公司离台
- 聊聊“文章代写”这个传统网络项目
- git 将项目添加到github库中