- 博客(49)
- 收藏
- 关注
RSS订阅原创 vue富文本编辑器
// // 富文本元素// private editor={}// // 编辑器调用// private editorInit() {// this.editor = new E(’#editor’);// // 自定义菜单配置// (this.editor as any).config.menus = [// ‘head’,// ‘image’// ];// // 开启debug模式// (this.editor as any).config.
2022-04-02 16:57:45
1508
原创 ts判断数据是否存在
private judgeTime = [null, '', 0, undefined] // 判空if (!this.judgeTime.includes(data.endTimeTo){}
2021-12-27 17:43:04
1630
原创 element 根据prop动态改变数据
<template slot-scope="scope"> <div v-if="item.prop==='serverId'"> {{ scope.row[item.prop]===11?'22222':"55555" }} </div> <span v-else>{{ scope.row[item.prop] }}</span> .
2021-12-22 21:45:07
862
原创 element table根据row的数据对表格横排进行隐藏&&动态prop
这里我的prop根据select框进行动态改变 ,row-class-name="tableRowClassName"这个一定要写上<el-table :data="List" stripe fit style="width: 100%;" :row-class-name="tableRowClassName" ><el-table-column label="标题"
2021-12-22 21:40:14
885
原创 sourceTree配置SSH及使用
一、配置私钥工具 -选项1.找到ssh私钥位置选择id_ras 2.选择OpenSSH 3确认二、配置好私钥后提交代码点提交，把暂存提交文本框2，（feat: h5活动配置 & build）一定要注意commit规范：首字母不能为大写，以及空格问题...
2021-12-17 13:45:26
5380
2
原创 element 动态绑定prop&&多层验证处理
<el-form-item label="多语言关联" :prop="'weaponAttackList.'+index+'.langMark'" :rules="rules.weaponAttackList.langMark" > rules = { weaponAttackList: { langMark: [{ required: true, message: '必填' }] } }.
2021-12-15 00:18:05
1430
原创 表单验证validator
//undefined 的时候不会触发表单验证 ''的时候会触发 code_pre_next_info: [{ required: true, validator: (rule: any, value:any, callback: Function) => { const message = '输入礼包数量需要大于0' const message2 = '必填' const validValue = value.filter((
2021-12-15 00:12:33
765
原创 v-show渲染时数据不存在报错
v-show只要满足条件，视图将会渲染，渲染后条件为false时候，其实视图还存在，只不过是被display:none隐藏。这个时候如果之前通过v-show控制的元素的数据丢失就会报错，归根到底还是跟其渲染方式有关系，使用v-if可以解决问题。v-if条件存在就会重新渲染视图，会触发v-if控制的元素的vue生命周期钩子函数，v-show不会。...
2021-12-15 00:10:00
1016
原创 element 表单验证通过必要条件控制存在与否
const rules=[ send_server: [{ required: true, message: '必填', validator: this.a}], private a(rule: any, value:any, callback: Function) { callback(this.formData.code_is_bind === '1' && this.formData.send_server === '1' && !value ? '' :
2021-12-09 19:49:00
178
原创 Try `npm install @xxx` if it exists or add a new declaration (.d.ts) file containing `declare module
在src目录下创建文件declaration.d.ts 如何贴代码如下declare module 'xxx'
2021-12-01 20:24:48
5647
原创 ts+element+vue filters 时间戳转正常时间格式
filters:{ filterOnlineTime(data:any){ const dt = new Date(data) const y = dt.getFullYear() const m = (dt.getMonth() + 1 + '').padStart(2, '0') const d = (dt.getDate() + '').padStart(2, '0') const hh = (dt.getHours() + '').
2021-11-25 18:47:17
246
原创 element ui使用＜＜＜和/deep/都覆盖不了原样式，覆盖样式的其他方式
element ui使用<<<和/deep/都覆盖不了原样式，覆盖样式的其他方式很多时候都会遇见这样的困惑，今天记录一下，希望对大家有帮助<style lang="scss" scoped></style>//在其下面在加一个style,加的时候别忘记了lang='scss'，否则无法编译<style lang="scss"></style>这样就可以完美解决问题了...
2021-11-23 23:38:25
570
原创 GL-HOOK-ERR: 本项目开启了commitlint检查，您的提交不符合规范，具体规则可以查看：http://commitlint.js.org/
错两次了，记录一下Enumerating objects: 298, done.Counting objects: 100% (298/298), done.Delta compression using up to 12 threadsCompressing objects: 100% (275/275), done.Writing objects: 100% (298/298), 502.53 KiB | 2.16 MiB/s, done.Total 298 (delta 16), reus
2021-11-23 19:36:51
2889
原创 vscode配置保存后与项目一致的.eslintrc.js
//找到setting.json{ "[javascript]": { "editor.defaultFormatter": "vscode.typescript-language-features" }, "[vue]": { "editor.defaultFormatter": "octref.vetur" }, "[typescript]": { "editor.defaultFormatter": "vscod
2021-11-09 21:39:31
720
原创 vue清除项目默认样式
首先在src目录下创建styles文件夹，文件夹里面有main.scss和normalize.scss两个文件main.scss@import "./normalize.scss";normalize.scss/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css *//* Document =====================================================
2020-12-10 15:16:52
3426
1
原创 promise和async await区别在哪？到底怎么用？
promise 和async await是什么？我们常用的与后端交互的axios插件是基于ajax封装的，ajax是一个异步的玩意，因此我们在使用axios的时候假如需要让接口按照先后顺序执行的话就需要到promise或者async await了。promise不多哔哔，直接进入主题，promise到底怎么玩？贴代码 let a = new Promise((resolve, reject) => { var num = Math.ceil(Math.random() * 10
2020-12-07 15:34:25
1880
5
原创 element ui 树形控件复制粘贴即可用
需要下载lodash父组件<template> <div> <myTree :data="allData"></myTree> </div></template><script>import myTree from './myTree'export default { components: { myTree, }, data() { return { al
2020-12-01 19:28:16
588
原创 JS操作数组的reduce无法拿到初始值或者无法操作第一个值
首先我们回忆一下reduce的用法1.var arr=[1，2，3，4，5]arr.reduce((item,cart,index,arr)=>{})cart的值为2，3，4，5item=12.踩坑点cart：代表当前元素的值index： 代表当前下标arr：代表原数组 [1，2，3，4，5]item：代表一次回调的值 初始值为默认为数组的第一个值,但是假如在}后设置了值，则默认值为所设置的值，假如不设置默认值，cart无法操作到其第一个值设置默认值如下var arr
2020-12-01 19:04:19
1454
1
原创 防抖节流
防抖//mountedwindow.addEventListener("click", this.debounce(this.handle, 1000));//防抖debounce(fn, wait) { var timer = null; return function () { if (timer !== null) { clearTimeout(timer); } timer = setTimeo
2020-11-18 19:21:51
54
原创 js操作数组大全
01.数组扁平化数组扁平化是指将一个多维数组变为一个一维数组const arr = [1, [2, [3, [4, 5]]], 6];// => [1, 2, 3, 4, 5, 6]方法一：使用flat()const res1 = arr.flat(Infinity);方法二：利用正则const res2 = JSON.stringify(arr).replace(/[|]/g, ‘’).split(’,’);但数据类型都会变为字符串方法三：正则改良版本const res3 = J
2020-11-18 16:06:45
114
原创 css背景图片不显示
background: url("../assets/image/home.png"); background-size: 100% 100%; height: 100%; position: fixed; width: 100%; position: relative;
2020-11-05 15:45:12
365
原创 vue {{}}内将动态字符串转成动态变量
html<span >{{ arr[`${url}`][id-1] }}</span>//url本为动态字符串，这么设置后将变成动态变量data id:"", url: "", arr: { data1: [ "1924年4月，国际著名诗人泰戈尔" "19而起。陈三立在诗序中说，“余以荒老", "三立闻之十分气”。", ], dat
2020-11-04 20:28:39
1543
原创 移动端调试神器vconsole
安装：npm install vconsole//main.jsimport Vconsole from 'vconsole';let vConsole = new Vconsole();export default vConsole结束，波波出品，定是精品
2020-10-21 17:33:50
152
转载 基于vue 公告轮播
<template> <div> <div class="textBox"> <transition name="slide"> <p class="text" :key="text.id"> <el-tag type="warning">{{text.val.tag}}</el-tag> {{text.val.title}}</p>
2020-10-19 18:25:18
1580
1
原创 移动端自适应，傻瓜式操作
1.下载lib-flexible使用的是vue-cli+webpack，通过npm来安装的npm i lib-flexible --save2.引入lib-flexible在main.js中引入lib-flexibleimport 'lib-flexible/flexible'3.设置meta标签通过meta标签，设置设备宽度以及缩放比例<meta name="viewport" content="width=device-width, initial-scale=1, maxim
2020-10-19 15:20:09
386
原创 vue css3动画
css3动画总结1.过渡transition: property duration timing-function delay;property:需要过渡的属性,如果是全部则为all;duration:过渡的时间取值,多少时间完成整个过渡效果transition-timing-function:过渡效果的速度控制;取值:linear(匀速)ease(先慢后快再慢)ease-in (慢速开始)ease-out(慢速结束)ease-in-out(慢速开始和结束)delay : 延迟效果
2020-10-16 18:08:30
393
原创 vue项目多个环境配置
1.首先大家需要知道.env.文件名这种文件的作用，这边不做过多的解释，自行百度。贴出.env文件参考ENV = 'production'outputDir = 'prod'VUE_APP_BASE_API = ''2.通常来说npm run build会执行.env.production这个文件夹，也就是说你在.env.production这个文件夹配置的VUE_APP_BASE_API赋值给全局请求拦截的baseURL，即可打包基础地址为VUE_APP_BASE_AP的包。import
2020-10-14 13:45:50
913
原创 element ui分页
<el-pagination :page-size="count"//每页多少数据 :pager-count="5"//页码超过多少折叠 layout="prev, pager, next"//组件显示顺序 :total="total"//一共多少页 后端传过来的 @prev-click='prevClick' //点击上一个 获取当前页码 @next-click='prevClick' //点击下一个 获取当前页码
2020-10-12 19:17:40
122
原创 vue vuex实战操作
vue安装脚手架的时候选择vuex后会生成store文件夹1.文件夹里面的index.jsimport Vue from "vue";import Vuex from "vuex";import a from "./modules/a";//引入不同模块的JSVue.use(Vuex);export default new Vuex.Store({ state: {}, mutations: {}, actions: {}, //模块引入 modules: { a,
2020-09-08 23:39:43
164
原创 watch和computed
两者的区别computed初衷用于计算数字，但是复杂的逻辑都可以使用其进行操作。相比于方法其数据具有缓存效果，并且每当触发重新渲染时，不需要总是去调用函数。特点依赖属性发生改变的时候，其才会改变，一个属性受多个属性影响。watch可以用来监听数据和路由变化，特点一个数据可以影响多个数据。1.计算属性//css<div id="example"> <p>Original message: "{{ message }}"</p> <p>Compu
2020-09-08 22:44:13
426
原创 全局请求拦截配合
import axios from 'axios'import { getToken } from '../utils/token'const service = axios.create({ baseURL: 'http://39.106.231.90:3000', timeout: 5000})//全局请求拦截service.interceptors.request.use( config => { config.headers['authorization']
2020-08-30 19:24:40
343
原创 element Ui中使用vue的过滤功能
在vue中{{所有的数据|过滤的函数filter()}}。filters与methods同级，filters里面写过滤的函数，过滤的函数可以在vue{{}}里面使用，并且能对数据进行筛选。ps(多用于element里面的prop的数据的改变，因为prop接收的参数是固定的不可以改变的)...
2020-08-25 20:39:35
505
原创 git代码版本回退
代码版本回退不小心把本地写的东西pull了下，然后，全部覆盖掉了git reflog //命令查看你的历史更改记录git reset --hard 版本号完成以上操作，恭喜你的代码回来了
2020-08-15 15:53:35
100
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人