- 博客(48)
- 收藏
- 关注
原创 vue3.0中axios的使用,用this报错
由于vue3.0中setup()里不再使用this,所以常见的this.$axios方式也不能再用。2.使用vue-axios,结合vue.use()和provied-inject。3.封装好后在每隔.vue页面使用的时候都。
2022-08-01 15:42:39
1133
原创 vue3.0,vuex使用(dark不必),用provide、inject、localStorage实现
vue3.0, vuex,provide+inject+localStorage,状态管理
2022-04-01 15:33:52
1798
原创 vue3.0,setup()的使用,Composition Api(组合式api)data,computed,methods,watch
vue3.0,setup,组合式api
2022-03-29 17:15:04
2104
原创 echarts或vcharts的X轴设置
vchartsvcharts就是基于vue对echarts进行封装后的图表组件,其配置有两个参数settting和extend,settings的参数格式参照vcharts的官方文档(https://v-charts.js.org/#/),extend参照echarts的官方文档,如果同时存在两个参数,extend会覆盖掉settings中相同的配置感觉vcharts使用的数据格式比vcharts简单一点xAxis: { show: true, // 是否显示 x 轴 posit
2021-09-30 09:45:40
5533
1
原创 CSS 水平垂直居中
1.利用position和transform//父元素.fuBox{ height: 600px; background-color: gray; position: relative;}//子元素,如果这里子元素的宽高固定,也可以不用transform,直接使用固定的left和top.testCenterBox{ height: 100px; width: 100px; background-color: #fff; position: absolute; lef
2021-09-22 14:23:20
139
原创 vue 上传,下载,预览文件及预览TXT时乱码处理
1.上传文件/*这里顺便写一下再vue中获取input里选择的文件,具体的input属性可去官网查看*/<input class="import-input" type="file" accept=".xls, .xlsx" ref="importInput" @change="fileChange(e)"/> /*这里只写methods里的方法*/fileChange (e) { // 如果需要验证逻辑,自行添加,比如只支持txt后缀名的文件,e.target等于t
2021-09-07 15:44:23
5466
1
原创 vue引入字体,自定义字体
字体文件后缀名一般为ttf,想在vue项目中引入字体并自定义字体的名字:1.在全局css文件夹内新建一个引入字体的文件@font-face { //也可以写其他样式比如color,fontSize之类的 font-family: 'shrry'; //自定义字体名 src: url('./../../../assets/shrryFont.ttf'); //引入字体文件 font-weight: normal; font-style: normal;}2.在main.js中引
2021-09-03 16:12:09
500
原创 常用input输入限制数字,汉字,英文字母等
复制代码 代码如下: <input type="text"onKeyUp="this.value=this.value.replace(/[^\.\d]/g,'');if(this.value.split('.').length>2){this.value=this.value.split('.')[0]+'.'+this.value.split('.')[1]}"> 1.文本框只能输入数字代码(小数点也不能输入) 复制代码 代码...
2021-07-26 14:13:07
996
原创 git 远程合并分支(其他仓库类似)
使用场景:团队当前开发项目的版本分支为set_dev1.0.1,自己的开发分支为wang_dev_1.0.1。现在再自己的分支上修改了代码,想要同步到团队分支set_dev1.0.1。步骤:假如当前分支为wang_dev_1.0.1,默认使用vscode开发工具;1.先把已经更改的文件暂存2.把团队分支pull下来这里就使你的分支和团队分支除了你修改的地方其他都一样,方便后面merge3.看看pull下来之后这离得更改有没有新增如果有新增,并且内容冲突(改了同一个文件),就要与相关开发得人
2021-06-02 14:57:08
806
原创 vue.js PC端复制分享Url链接,复制内容到剪切板
1.下载插件vue-clipboard2npm install --save vue-clipboard22.main.jsimport VueClipboard from 'vue-clipboard2'Vue.use(VueClipboard)3.在vue文件中<button @click="copy">分享</button>copy () { // 这里注释的方式是把url里的路径去掉了,也可以自己修改路径以及添加参数 // let invitelin.
2021-05-19 15:41:11
1253
原创 vue3.0 + typescript 变量基本类型及使用介绍
基本类型布尔值let a: boolean = false // 也只能将boolean类型的值赋值给a数字let a: number = 1 // 也只能将number 类型的值赋值给a// 和JavaScript一样,TypeScript里的所有数字都是浮点数。 这些浮点数的类型是 number。// 除了支持十进制和十六进制字面量,TypeScript还支持ECMAScript 2015中引入的二进制和八进制字面量。let b: number = 6;let c: number =
2021-05-12 21:50:05
4442
转载 vue pc生成二维码支付
这里介绍两种vue生成二维码的方法QRcodevue-qrvue-qr比QRcode功能多在可以在中间加logoQRcodenpmnpm install qrcodejs2 import在所需页面导入import QRCode from 'qrcodejs2'use复制代码<div class="qrcode" ref="qrCodeUrl"></div><script>methods: {creatQr...
2021-04-15 17:55:43
531
原创 vue 异步加载组件
先说一般的组件方式嘛<template> <div> <button @click="show">点我</button> <div v-if="isShow"> <Good></Good> </div> </div></template><script>import Good from "./success"export
2021-04-15 15:52:47
576
原创 vue 在组件上使用v-modul
在平时会遇到一些input,select,checkbox,radio等组件,需要使输入到组件的值与父组件所对应值双向绑定,而这一般通过v-modul可以实现在这里我已经注册好全局组件了,可以直接使用.因为名字不一样,我就懒得每个都改一次了,都用Select1.input type=“text”这种类别的// 父组件<template> <div> <Select v-model="hi"></Select> <p>{{ hi
2021-04-15 15:20:19
367
原创 vscoed 新增自己的代码模板
在写代码的时候新建一个文件,比如.vue文件,都希望能模板不必自己再写这里就讲下怎么新增自己的代码模板也可以通过右上角点击设置-首选项-用户代码片段我自己新建了两个vue-ts和vueTs,自己另外新建就要输入模板名字,输入之后把这些注释全部删除只留下一个{ },然后在里面加"Print to conaole": { "prefix": "vueTypeScript", "body": [ "<template>", "<div></div&
2021-04-14 11:11:55
352
原创 TypeError: this.getOptions is not a function,vue或react都可能有
在vue3.0 + ts 想使用less时使用@import 的方式引入less文件结果报错Syntax Error: TypeError: this.getOptions is not a function后来弄了半天才发现时less的版本过高,不得行解决办法: 1.卸载less:npm uninstall less-loader2.重新安装:npm install less-loader@5.0.0这里我就先安装了5.0版本,其他版本也可自行尝试...
2021-04-13 17:01:10
280
原创 vue3.0 + ts + vue-property-decorator引入报错
vue-property-decorator是由社区根据vue官方的vue-class-component开发的,现在vue-class-component更新了,原先引入的 Compenots 变成了现在的Options但是vue-property-decorator的源码并未同步更新,所以在用时就会报错解决提示报错后,在node_modules/vue-property-decorator/bin/index.js找到把前面几行代码改成这样就行...
2021-04-08 17:28:28
3975
2
原创 localstorage 本地存储及token设置,vuex刷新数据丢失
本地存储简介简单介绍:前端开发时js可以调用api在浏览器存储数据,大小总共未5M可再浏览器查看,f12打开控制台方式:1.localstorage在本地浏览器长期存储,需要手动清除才会消失(清除浏览器缓存或调用js方法清除)2.sessionstorage在本地浏览器存储,但只存在一次会话级(即浏览器关闭再打开就没了)使用:localstorage和sessionstorage使用一样,下面的只需要替换就行// 存:第一个参数为存在本地的名字,即本地容器的名字localstorag
2021-04-02 16:33:29
3269
原创 git vscode下拉代码到本地推送到远程,本地分支远程分支关联、合并
前言在现在的代码管理中,基本都使用git管理,而git除了命令操作之外,代码编辑器也顺带兼容了git的使用,这里就来介绍下vscoed中git的使用clone 先把项目克隆下来,这一步习惯使用命令git clone **** 跟上你的项目git地址就行了,默认是拉取的master分支的如果就在master分支上开发,那这步就不需要了,当人很少会在master分支上开发如果已有开发的分支:点击vscode左下角的这个分支图标这里选择你要开发的分支即可如果你要创建自己的开发分
2021-03-31 15:44:11
8020
4
原创 JS 字符串方法 API
字符串string:var str = ‘hello everybody,Look at me’// length str.length 返回字符串长度,空格也算在内/* indexOf(),lastIndexOf() 一个从开头往后找,一个从最后往前找两个都是从字符串里查找指定字符串所在位置下标,返回下标值,若未找到都返回-1str.indexOf(‘llo’) — 2 str.lastIndexOf(‘llo’) — 2 str.indexOf(‘look’) — -1 区分大小写str
2021-03-17 11:15:48
308
1
转载 git 命令下拉代码到本地 本地分支远程分支关联
#git 拉取远程代码 在实际项目开发过程中,往往是已经存在远程项目了,我们定义的需求是只需要简单的操作git,能够上传和下拉最新代码。 模拟小白需求: 第一步:拉取远程代码 git clone https://github.com/…/PrettyGirls.git 第二步...
2021-03-05 15:27:07
964
原创 vuex moduls模块化,mutations和actions使用区别
vuex-moduls在一些项目中vuex需要分成一些各自模块,彼此数据不影响文件结构:在src/store内新建模块名的文件夹,例: a.js和aa.js 分别是模块a和aa其中每个js文件都可以当成一个单独vuex结构来写,在a.js中(aa.js也差不多)export default { namespaced: true, // 详见后后面的使用方法3 state: { aId: '500' }, mutations: { changeId(state,va
2021-02-25 11:18:52
682
原创 vuex 使用简介
vuex基本结构import Vue from "vue";import Vuex from "vuex";Vue.use(Vuex);export default new Vuex.Store({ state: { num: 2 }, mutations: { changeNum(state,val) { state.num = val } }, actions: { todo({ commit }, val) { commit('
2021-02-23 11:25:32
166
原创 字符串和数组的翻转去重及常规操作(未完,待补充)
**翻转字符串** let str = 'hello word' let strs = str.split('').reverse().join('') console.log(strs) // drow olleh **字符串去重** let str = 'abkadababkdasdmbasfjdsgf' let strs = str.split('').filter((item, index, arr) => { return arr.indexOf(ite..
2021-02-20 15:31:59
176
原创 es6 数组遍历 foreach、map、filter 多层数组深浅拷贝 vue
#foreach对数组的每一项进行操作,不会产生新数组 let arr = [1, 2, 3] arr.forEach((item, index, value) => { console.log(item) // 每一项的值1,2,3 console.log(index) // 每一项的下标0,1,2 console.log(value) // 整个数组[1,2,3],[1,2,3],[1,2,3] })#m
2021-02-19 11:10:32
1630
原创 vue router传值 this.$route this.$router
#Router 和 Router 区别在vue的开发中路由router是必不可少的一部分,下面就简单的说下其中router和route的区别![在这里插入图片描述](https://img-blog.csdnimg.cn/20210218171213137.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hvY2tKZXJyeQ==,size_1
2021-02-18 17:13:48
910
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人