vue开发
HelloFuckingWorld
这个作者很懒,什么都没留下…
展开
-
Vue3:watch属性的坑||监视reactive数据时遇到的问题||深度监视||无法获取oldValue的原因
Vue3在使用watch属性监视reactive定义的响应式数据时遇到的坑:1.当监测对象为对象类型时,无法获取到oldValue。2.当监测对象是reactive定义的数据时,强制开启深度监视。3.当监测对象时reactive定义数据中的一个类型为对象的属性时,需要手动开启深度监视。 // 监视ref定义的一个响应式数据 watch(sum,(newV,oldV)=>{ console.log(newV+'-'+oldV);原创 2022-04-03 13:10:37 · 5522 阅读 · 0 评论 -
关于VUE:添加的component组件无效|vue对象实例化和component定义的先后顺序问题|vue问题
问题:我定义了一个组件component,想在页面中显示该组件。 <div id="app"> {{title}}<br/> <component1></component1> </div><script> var vue1 = new Vue({ el:'#app', data:{ title:'aaaaaaaa'原创 2021-11-22 11:39:09 · 3385 阅读 · 0 评论 -
关于Vue:elementUI中的el-table表格默认的“暂无数据”怎么修改?
问题:没有数据时的table中提示信息不合适或者样式不合适,怎么修改?方法:在中添加 <el-table> <template slot="empty"> <span style="font-size: xxx-large">当月无人机没有监测记录</span> </template> </el-table>修改了提示信息和字体原创 2021-06-28 19:03:48 · 3957 阅读 · 0 评论 -
Vue项目:如何实现短信验证码登录?
1.选择一个短信平台,这里选择网建短信通,在该平台进行注册。2.在该平台进行登录,点开接口设置功能可以看到用户名,安全密钥以及短信签名,如果发送的短信内容是验证码的话,最好加上短信签名,如在短信签名输入框中写:安全公司3.在项目中进行功能的实现Step1:安装axios依赖方法:1.在package.json中的dependencies中添加"axios": "^0.21.1",2.在终端命令行中输入npm install,进行安装Step2:在vue.config.js中配置跨域dev原创 2021-06-22 11:24:30 · 3496 阅读 · 0 评论 -
Vue开发:vue中如何获取指定月份的最后一天/时间选择器选择指定月份后如何获取它的最后一天
问题描述:Vue页面的时间选择器选择指定月份,查询数据库的url需要参数为:开始时间 、结束时间查询结果为这个时间范围内的所有数据因此需要获得选择的月份的最后一天的最后一秒如:选择月份为2021年6月,则生成的开始时间为2021-06-01 00:00:00结束时间为2021-06-30 23:59:59那么怎么获得这个结束时间呢?解决办法:Step1:先在项目中安装 ‘moment-timezone’ 依赖Step2:导入依赖import moment from 'momen原创 2021-06-11 14:35:27 · 2571 阅读 · 3 评论 -
Vue开发:echarts图表的markLine标签会与y轴的刻度轴相互遮挡
问题:右边markLine平均值线的标签显示在y轴刻度轴,想让他显示在图表里面markLine: { data: [ { type: 'average', name: '平均值' } ], precision: 4, label: { position: 'end', p原创 2021-06-09 10:32:25 · 1407 阅读 · 0 评论 -
Vue开发:echarts图表中的最大值最小值标记或者其他文本超出边界显示不全
问题:类似于最大值标记显示不全,或者其他只要是echarts图表中的内容超出边界显示不全的问题解决办法:使用boundaryGap: ['0%', '20%']属性使用位置:在options中的yAxis:[ { } ]中添加参数含义:对于数值轴,如value轴,boundaryGap能够让两端留白,即增加该轴的刻度范围。第一个参数是最小刻度的留白,第二个参数是最大刻度留白。 感谢收阅...原创 2021-06-09 10:09:42 · 1281 阅读 · 0 评论 -
Vue项目:如何用echarts实现双y轴/柱状图/折线图
问题:想让这个柱状图实现双y轴,能够展示两个数据组,该怎么办?解决办法:在配置options时,series中的一个y轴数据处,添加 yAxisIndex = '1'那么有此属性对应的y轴刻度就会显示在图表右边 感谢收阅...原创 2021-06-09 09:59:07 · 1690 阅读 · 0 评论 -
vue中使用echarts,其中用到formatter时如何进行字符串的换行?
问题:期望显示成 均值线:(回车)数据 的形式解决办法:formatter: function(params) { var res = '均值线:\n' + params.value return res }使用’\n’实现换行 感谢收阅...原创 2021-05-17 14:36:19 · 3692 阅读 · 0 评论 -
vue项目中使用echarts时,在柱状图中显示平均值,最大值,最小值超出边界,显示不全怎么办?
问题:红圈部分是用markPoint显示最大值,由于超出边界,显示不全解决办法:在柱状图的配置option中的yAxis配置中,预留空白 yAxis: [ { name: 'S检测值', type: 'value', splitLine: { show: false }, axisTick: { show: false }, axisLa.原创 2021-05-17 14:06:10 · 1732 阅读 · 0 评论 -
vue -03 vue项目如何进行优化以减少项目体积
问题:通过ui界面的分析报告发现项目的依赖项中许多组件占用了大量空间,资源中有的包占用了大量的空间优化的步骤:1.新建vue.config.js文件,在其中分别配置开发和发布模式module.exports = { chainWebpack: config => { // 发布模式 config.when(process.env.NODE_ENV === 'production', config => { config.entry('app').clea原创 2021-01-31 16:23:52 · 675 阅读 · 0 评论 -
vue -03 项目在发布阶段提示不能有console命令(no-console)(处理办法)
问题:项目在发布阶段不能有控制台的输出命令,控制台的输出命令只能是在开发阶段使用,如何实现在开发阶段使用控制台输出命令,而在发布阶段不适用控制台输出命令,即如何使console.log()命令在发布阶段失效?解决办法:使用babel-plugin-transform-remove-console依赖步骤:1.安装依赖2.在babel.config.js文件中调试// 区分一下是开发阶段还是发布阶段const prodPlugins = []// 发布阶段即添加消除控制面板打印的方法if原创 2021-01-31 11:31:28 · 1997 阅读 · 0 评论 -
vue -02 vue中如何使echarts展示的报表的功能更加完善
使用lodash中的merge函数使用方法:1.在vue文件中导入import _ from 'lodash'2.在数据域中定义自己待合并的options配置项 options: { title: { text: '用户来源' }, tooltip: { trigger: 'axis', axisPointer: { type: 'cross',原创 2021-01-31 09:25:35 · 150 阅读 · 0 评论 -
vue -01 TypeError: Cannot read property ‘init‘ of undefined (在vue中使用echarts)
错误:原因:版本错误解决方法:前提:使用5.0版本的echarts方法1.替换为4.8版本的echarts方法2:import * as echarts from ‘echarts’ 导入(而不是用import echarts from ‘echarts’)原创 2021-01-30 17:25:08 · 128 阅读 · 0 评论