Vue框架
文章平均质量分 92
vue相关
爱唱歌的前端
今天采坑了吗?
展开
-
vue3中怎么巧妙的去运用jsx?
我们都知道vue3是支持用jsx/tsx,但是好像从来都没有人告诉我们应该怎么运用到项目当中,下面是我觉得不错的一种使用方式,分享给大家。原创 2023-12-26 16:30:43 · 1165 阅读 · 0 评论 -
vue3移动端适配的解决方案
最近在给公司内部做一个BBS论坛,需要在电脑和手机上都可以操作,所以需要做移动端的适配,下面是我在开发后觉得不错的一些解决方案,分享给大家。原创 2022-12-03 12:30:37 · 11365 阅读 · 4 评论 -
vue3中使用Apache ECharts
首先祝贺Echarts顺利的从Apache毕业,多了个响亮的名字:,现在的官网地址在这里:传送门,首页相当的国际范,看着比以前舒服多了,但是文档还是那个文档(T▽T)最近在做一些数据透析的项目需要用到报表图,那么报表图好用的有老牌的ECharts,比较新意的AntV,思前马后的想了一下还是用了Echarts,因为AntV的产品线真的是五花八门,比如G2、G6、F2、L7,看得我头晕眼花,所以决定用Echarts省事多了。二、测试运行测试的话直接用全量引入了,看着简洁点。使用的话还是和以前差不多,获取原创 2022-11-01 09:23:54 · 815 阅读 · 1 评论 -
vue3 el-table多级表头收缩扩展的实现
最近在做一些数据展示类型的项目,其中有一个表格需求把我吓懵了,大概是这样的,表格的每一行数据可能会有子集,父级行要与子集行用颜色区分开来,这个好处理,el-table给我们提供了树形数据与懒加载来处理每一行存在层级的关系,行的颜色可以用table-属性的来动态绑定颜色;另外是表头,表头有多级,这个官网的多级表头有,除此之外一个多级表头可能还会有子集,并且需要收缩扩展和颜色区分,颜色区分可以用table-属性的提示。......原创 2022-07-30 13:01:37 · 3225 阅读 · 0 评论 -
vue3中使用Web Worker多线程
最近在做vue3的项目中,遇到了计算量庞大导致页面响应缓慢的问题,正好每个计算任务的结果不需要汇总,所以想到了以多线程的形式去执行每个计算任务。但是通过一轮google、baidu都没有找到vue3的案例,还好在外网的一篇案例中嗅到了一丝可能。大佬可以跳过, 对于Web Worker多线程可能有很多小伙伴还不知道是干嘛的,所以我先举一个列子让大家知道它大概是用来做什么的。①洗完澡后再洗衣服: 在没有洗衣机(Worker)前,通常都是先洗完澡后再手洗衣服(这里我除外,我都是踩着衣服一起洗澡的),这样我们每天都原创 2022-06-18 10:55:05 · 14835 阅读 · 15 评论 -
vue3中使用swiper7轮播图插件
项目场景:前不久刚在我的vue3项目中用了swiper6,坑真的是比农村的泥路还要多,这不官方直接来了个swiper7,接下来手把手教下大家怎么用,让大家少走弯路。另外swiper7的话不会出现打包后放服务器样式丢失的情况了=》swiper6普通vue3项目:win10的小伙伴我们可以先在桌面(或者文件夹里)按住Shift之后点击右键打开Powershell窗,不是的自己打开cmd,效果是一样的。之后在命令行里面输入vue create vue3接着选择创建默认的vue3项目接着用V原创 2021-11-16 18:03:40 · 11090 阅读 · 35 评论 -
vue3项目打包部署服务器后swiper6控件不显示,模块样式丢失
问题描述:最近在用vue3部署自己的个人主页,其中用到了最新版的swiper6.7.0,在本地中打开是没有任何问题的,但是当我把项目打包部署到服务器后,发现swiper6控件不显示,两侧切换卡片的按钮(Navigation)和页数小圆点(Pagination)都不显示,于是就打开浏览器控制台看了下,发现控件的HTML结构是有的,但是CSS样式却没有,于是便百度谷歌,但是依旧没能解决这个问题,最后自己折腾了一宿,终于解决了(T▽T) 解决方案:swiper6官网模板里引用样式用的是import /原创 2021-06-20 17:22:48 · 1300 阅读 · 11 评论 -
vue3中怎么使用router路由呢&页面跳转传参怎么搞呢
描述:最近想弄一个自己的个人主页,正好vue3也已经出来了,想尝鲜,于是便用vue3来构建了自己的项目,结果处处碰壁,不过这是好事,说明又有很多新的东西学了(等会,我2.x还没学废(ಥ﹏ಥ))。好的,接下来要分享的是在vue3中要怎么去使用router路由。1.安装 npm install vue-router@4 --save...原创 2021-06-01 09:19:48 · 12222 阅读 · 8 评论 -
Vue中使用JQuery
安装jQuery依赖npm install jquery --save或者用淘宝镜像cnpmcnpm install jquery --savewebpack.base.conf配置文件相关添加如下图const webpack = require('webpack')// 添加代码plugins: [ new webpack.ProvidePlugin({ ...原创 2019-09-09 16:40:09 · 175 阅读 · 0 评论 -
Vue中使用ECharts
安装echarts依赖npm install echarts -s或者使用淘宝的镜像npm install -g cnpm --registry=https://registry.npm.taobao.orgcnpm install echarts -sHTML中容器需要给宽高<div id="myChart" :style="{width: '100%', height: ...原创 2019-09-09 15:35:46 · 479 阅读 · 0 评论 -
Vue&axios中get和post请求的简单封装
命令行安装相关:npm install --save axios vue-axios qs报错的话用淘宝镜像执行: cnpm install --save axios vue-axios qs代码:import axios from 'axios'import Qs from 'qs'Vue.prototype.baseUrl='http://kangjianyu.onlin...原创 2019-07-02 12:18:48 · 4118 阅读 · 1 评论 -
Vue&Element隐藏组件el-scrollbar滚动条
注意:<el-scrollbar> </el-scrollbar>这个组件的外层和内层一定要有一个div,本文定义了div 'father’和div “child” , div 'father’设不设置高度都可,但没有这个div的话底部和出现一条横向的滚动条如下图;div “child” 一定要设置高度不然的话滚动条是出不来的,最后div "child"里面才是我们要放的...原创 2019-06-04 11:49:11 · 5390 阅读 · 3 评论 -
Vue组件的使用与传参
router.js中自定义组件父页的JS中引入组件在components中加要用的组件(components对象没有的话自行写上)父页的CSS中引入组件父组件向子组件传参data() 中自定义变量组件中加上: :id=“自定义的变量”组件的JS中加上: props: [‘id’],使用的话那里要用到直接this.id就可以拿到父页定义的变量了打印到控制台就更不...原创 2019-05-31 17:40:36 · 462 阅读 · 0 评论 -
Vue路由跳转传参
一.跳转传参1.query方式:(注意:path对应query,name对应params,传说接收都要对应,path要‘/’+跳转页的名字,name直接+跳转页的名字)*传出方式:*在这里插入代码片data(){ return{ var a = '123' } A(){ this.$router.push({ path: '/跳转页的...原创 2019-05-31 14:20:43 · 223 阅读 · 0 评论 -
我的小笔记 =》Vue
一.数组循环遍历//includes筛选用法let arr = ['a','b','c'];arr.includes('a')//全选框的例子var allChecked ;arr = [true,true,false] if (arr.includes(false)) { this.allChecked = false; } else { this.al...原创 2019-05-31 14:55:23 · 183 阅读 · 0 评论