![](https://img-blog.csdnimg.cn/20190927151124774.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
vue
文章平均质量分 55
vue学习
xi1213
在前端路上摸爬滚打的菜狗子
展开
-
pinia的使用
其实vuex也有自己的持久化方法,但我还是倾向于pinia,毕竟更简洁方便了。原文链接:id=64。原创 2023-11-09 16:20:18 · 199 阅读 · 0 评论 -
纯前端实现图片验证码
上面是vue3的实现,你也可以改写为vue2的。原创 2023-11-02 10:41:54 · 383 阅读 · 0 评论 -
vue3实现一个抽奖小项目
项目很简单,但给我的时间很少,很多优化的地方都没做好,后面有时间了再优化下,顺便适配下移动端。原文地址:https://xiblogs.top/?id=53。原创 2023-01-20 17:25:51 · 3942 阅读 · 2 评论 -
数据看板可视化
感觉可视化项目难度不大(当然这只是对于我这种只会用轮子的懒人加缝合怪来说),无非就是熟练利用echarts配置,但麻烦的是效果需要自己仔细调节。原创 2022-12-15 19:05:05 · 1437 阅读 · 0 评论 -
vue导出word文档
中有一个功能需要导出word文档,在页面点击按钮后处理数据生成word文件,然后自动下载文档。原创 2022-11-06 18:51:54 · 1872 阅读 · 2 评论 -
DataV兼容vue3的方法
2、将node_modules/@jiaminghi/data-view/lib/components/decoration3/src/main.vue中rect标签的:key="i"剪切到有v-for那一层的template中。3、将node_modules/@jiaminghi/data-view/lib/components/decoration6/src/main.vue中rect标签的:key="i"剪切到有v-for那一层的template中。现在重新运行项目看看,是不是不报错了?原创 2022-11-04 23:03:00 · 3860 阅读 · 3 评论 -
vue中代理解决跨域
简单的讲就是你在一个地方使用另一个地方的资源,被浏览器给挡下来了,不让不用!当然,它挡下来是有自己理由的:为了安全(╬▔皿▔)╯。target就是自己需要代理的真实地址getIpMsg你是可以自定义的。我是用vue开发的,就vue代理模式解决跨域说明一下。原创 2022-09-13 16:23:40 · 2047 阅读 · 0 评论 -
vue+xlsx实现表格的导入导出
前端在开发过程中若是管理系统之类的业务系统,则大多都会涉及到表格的处理,其中最为常见的就是表格的导入导出。有很多办法都可以实现,其中最简单的还是使用插件xlsx。在导入时,需要注意在new FileReader()的加载事件中不使用箭头函数的话,this是不会生效的。...原创 2022-08-08 11:27:05 · 2350 阅读 · 1 评论 -
canvas实现图片标记
由于业务需求,需要有一个图片标记功能,其实就是对图片画框画线做标记,类似微信的图片编辑但是需要存下标记图及其标记的具体数据,。功能其实很简单,但刚开始的时候也是费了一些功夫的。我将原项目中该功能抽离出来单独写了一个demo,作为记录,同时你们在开发过程中有类似需求的话也可以参考一下该思路,其中有不足之处还请指出来。在开发过程中我还是踩了很多坑的,文章中记录的只是很少的一部分。还是建议看文章开头的项目源码链接,源码中我写了大量详细的注释。......原创 2022-08-07 13:52:43 · 3702 阅读 · 23 评论 -
vue打包后dist的使用
发现问题vue项目完成打包出dist后准备打开index.html,发现居然页面是一片空白,f12一片报红。分析问题经过多次网上查询后发现这是由于vue打包时,脚手架会帮你配置好大量参数,但其中路径publicPath被配置为了"/",需要手动修改。解决办法1、将vue.config.js中的publicPath:"/“修改为publicPath:”./"2、删除之前的dist重新打包。结语再次打包后打开dist中的index.html,发现页面出来了,但是如果页面有路由跳转的话,会发现跳原创 2022-03-15 09:27:36 · 5469 阅读 · 0 评论 -
vue自定义组件的点击事件失效
在vue开发过程中为了减少重复代码,很多时候都需要将重复的部分写成一个组件,方便调用。但是使用组件时很可能又会给该组件添加点击事件。如果直接这样写,事件则会失效:正确写法应该是这样:...原创 2022-03-03 16:59:31 · 838 阅读 · 0 评论 -
vue动态绑定样式
每次点击方块时通过三元表达式,改变对应的class,每一个不同的class对应不同的样式,从而通过改变class实现样式的切换。<template> <div class="container"> <!--通过三元表达式选择class使用对应的样式--> <div v-for="item in list" :key="item" :class="current == item ? 'current' : '.原创 2022-02-28 21:17:10 · 612 阅读 · 0 评论 -
vue组件间传值
父传子利用props传值,子组件中规定props数据类型,然后父组件使用子组件时需要绑定数据在子组件上:父组件:<template> <div class="parents-div"> <!--绑定msg传入子组件--> <Children :msg='msg'/> </div></template><script>import Children from './Children.vue原创 2022-02-27 00:24:25 · 360 阅读 · 0 评论 -
vuex的使用
vuex是什么vuex是一个专门为vue开发的状态管理工具,它采用集中式存储管理应用的所有组件的状态,其核心是state。vuex中有什么state:存放状态数据的地方,其中数据是响应式的,数据改变对应组件的数据也会跟新改变,禁止直接改变state中的数据否则数据无法被调试工具监测。getter:可理解为store的计算属性,能读取state中的数据。mutations:装着处理数据逻辑方法的集合体,是该改变state中数据的唯一方法,修改数据是同步的。actions:提交mutations修改原创 2022-02-27 00:23:07 · 18081 阅读 · 8 评论 -
vscode使用vue代码模板
1、vscode中打开:文件>首选项>用户片段>输入vue按下回车2、复制下面代码并保存。点击查看代码{ "Print to console": { "prefix": "vue", "body": [ "<template>", " <div class=''></div>", "</template>",原创 2022-02-27 00:15:52 · 942 阅读 · 0 评论 -
vue项目的创建
安装node1、检查node,未安装在这里下载最新版安装。2、检查npm,node自带npm但不是最新版本,需要命令更新:npm install -g npm安装vue脚手架1、在国内下载时网络会出问题,建议淘宝镜像下载,配置镜像:npm install -g cnpm --registry=https://registry.npm.taobao.org2、用cnpm安装vue脚手架:cnpm i -g @vue/cli(其中i是Install安装的简写,g是global全局的简写)。创建vu原创 2022-02-27 00:09:24 · 427 阅读 · 0 评论 -
vue中按需引入Element-ui
安装1、安装element-ui:npm i element-ui -S。2、安装babel-plugin-component:npm install babel-plugin-component -D。修改1、在项目根目录下新建.babelrc文件:2、在.babelrc中写入:点击查看代码{ "plugins": [ [ "component", { "libraryName": "element-ui", "styl原创 2022-02-27 00:04:29 · 507 阅读 · 0 评论 -
vue中使用sass
安装1、安装sass:npm i sass。2、安装sass-loader:npm i sass-loader@10.1.1。(安装sass-loader时会出现版本报错,建议使用10.1.1)使用在style标签中写入lang=‘scss’(勿误写为sass),样式代码直接嵌套编写,更加直观。...原创 2022-02-26 23:57:27 · 1079 阅读 · 0 评论