zWoods-CSDN博客

原创 vue2中引入vuex

因为是vue2所以使用的是vuex 3.几的版本。

2024-07-31 17:39:42 174

原创 vue封装axios

其中的qs模块就是对请求参数的一个格式化它可以将我们的参数自动拼接到url中。为了接口统一管理我们一般都是在src/api文件夹下面创建接口文件。目录：src/utils/request.js。例如：exampleApi.js。

2024-07-31 13:46:26 164

3.为了后续好维护vuex使用模块化创建modules 下面创建languageStore.js（分模块化文件模块只维护对应的语言不与其他的有冗余）2.下载vuex（注意我使用的是vue2对应的vuex 3.6.2版本如果是vue3应该是4版本具体引入方法看vuex最新官网）我们的项目需要适配中文，日文，英文三种语言，后端返回的数据是做了翻译机但是写在前端的一些字段也需要做翻译所以才有了这个功能。通过本地存储结合vuex状态管理实现配置语言文件里面的一键切换语言。5.最后就是页面使用。

2024-07-30 17:36:23 265

原创 vue导入xlsx表格获取数据写入表格中

下载方式npm install xlsx@0.16.1 0.18也可以引入方式一定要用require("xlsx")的方式。引入方式 var xlsx = require("xlsx");原理：主要依赖于 xlsx 包版本依赖 0.16.1。1.上传elcel表格得到表格对应的table数组。还用的了el-upload。

2024-07-27 15:36:22 355

原创 vue使用mock数据

对于前端开发后端接口没有完成的时候可以前端为了接口对可以先自己写一些mock数据自己对接。npm install mockjs 我这里下载的版本是1.1.0。4.封装再api文件下面的mockApi.js文件夹里面封装接口。2.再src下面创建mock文件夹下面创建index.js。3.再main.js里面引入全局mock。// 引入mock数据。1.下载mockjs。1.下载mockjs。

2024-07-27 15:21:01 301

原创 vue+element实现表格合并

通过对数据进行一个加工在每一条数据中加入向下合并多少的标识再通过span-method方法来实现合并。主要使用element-ui中的el-table中有个方法叫做span-method。通过这个方法可以实现表格行合并。

2024-07-25 10:02:12 170

原创前端通过腾讯地图api获取用户所在城市

前端使用腾讯地图api获取用户所在城市通过用户ip获取用户所在城市

2024-07-23 17:23:39 264

原创 vue3中使用富文本编译器

2.在components下面创建组件wangEditor.vue。为了方便使用我对wangeditor进行了一次组件封装。这里我使用的是wangeditor。我这里的是4.7.15版本。

2024-07-23 17:05:01 452

原创 vue实现前端图片加水印

创建一个Image对象，设置跨域属性，然后指定图片的src。当图片加载完成后，创建一个canvas元素，将图片绘制到canvas上。接着计算出水印文字的大小和字体样式，并设置填充颜色。函数得到水印的位置信息，然后遍历位置信息，对每个水印进行绘制。最后将canvas转换为DataURL，保存为。

2024-06-12 08:58:34 407

原创 vue+element-ui前端上传图片到七牛云计算图片的md5以图片的md5命名上传

当我们上传图片的时候第一步走的是 before-upload 所返回的方法在这个方法里面我们file对象操作完之后就会进入我们的。1.上传图片到七牛云并且计算图片的md5 这样同样的图片的md5是同一个就不会有重名问题纯前端。之所以计算图片的md5 是同一张图片无论你该什么名字 md5值不会变减少服务器重复储存同一张图片。3.用的加密方法是用的 crypto-js 三方插件的md5加密。2.我们用的是element-ui的上传组件。before-upload对应的函数里面作。

2024-04-13 06:14:22 447