c_liufeng的博客

分析：主要是bem 系统的构建，属性添加并无难点。

用组件的选项(data、computed、methods、watch)组织逻辑在大多数情况下都有效。然而，当我们的组件变得更大时，逻辑关注点的列表也会增长。这可能会导致组件难以阅读和理解，尤其是对于那些一开始就没有编写这些组件的人来说。看着代码行数都差不多，这只是最简单的一个示例，如果给获取鼠标位置添加各种业务。......

canvas 画静态流程图，canvas 画 圆、棱形、三角形、线条、曲线、文本、图片

方案1：文件名带有hash值实现无感发布: 系统更新时，只需要将打包之后的文件除index.html以外的文件（js/css/img），全部上传到服务器网站目录，未修改文件（即重名文件）直接跳过, 有修改的文件由于文件的hash值不同会被上传, 上传完毕我们再将index.html覆盖掉旧版就行。这段时间用户已请求旧版本index.html的无影响（不会出现文件404，因为新旧版本js/css同时存在），而新访问用户则请求的是新版index.html，访问旧页面用户刷新也会请求新版文件，并且无缓存影响，即

强制缓存Expires: new Date().toUTCString(); 即将废弃！！！缓存机制：判断本地时间是否大于缓存时间缺点：依赖本地时间，如果本地时间有更改，game over。。。Cache-Control: max-age=10;缓存机制：max-age 定义过期时间，时间一到就过期，单位秒。 缺点：无法判断请求内容是否过期。协商缓存Cache-Control：no-cache; last-modified: 文件更新时间缓存机制：通知浏览器使用协商缓存

import { DirectiveOptions } from "vue";/** * 对 element-ui 的无限滚动在 el-table 上使用的封装 */import elInfiniteScroll from "element-ui/lib/infinite-scroll";const elScope = "ElInfiniteScroll"; // scope nameconst msgTitle = `[el-table-infinite-scroll]: `; // me

运行环境“vue”: “^2.6.11”,“typescript”: “~3.8.3”,问题重现html <el-tree :data="treeOptions.data" node-key="id" @check="treeOptions.checkChange" />js问题1：export default class GoodsClassify extends Vue { private treeOptions = { data:

onUploadProgress 介绍axios({ methods: 'POST', url: 'your upload url', data: 'your data', onUploadProgress(e) { console.log(e.loaded) // 已上传大小 console.log(e.total) // 文件总大小 console.log(Math.floor(e.loaded / e.total * 100)) // 上传进度百分比 }})onUploa

错误：大量出现这种错误，一般由于你重写了mixins中的方法，而你使用private 进行重写导致错误出现。解决方法： private（私有） 变成 public（公共）

https.ts文件/** * @author 作者 * @time 2020-9-27 8:47 * @title http请求封装 * desc 前后端约定接口返回解构规范 * { * code: '1', * data:" 请求成功", * message: "" * } */import { Interceptor } from './interceptor';import { message, Modal } from 'ant-design

关于pc端适配走了很多弯路。现有设计图 1920方案一:1.使用postcss-pxtorem + amfe-flexible2.创建postcss.config.js 文件postcss.config.js配置如下 module.exports = { plugins: { "postcss-pxtorem": { rootValue: 192, // 设计图尺寸 propList: ["*", '!border

{ "defaultSeverity": "warning", "extends": [ "tslint:recommended" ], "linterOptions": { "exclude": [ "node_modules/**" ] }, "rules": { // 禁止自动检测末尾行必须使用逗号，always总是检测，never从不检测，ignore忽略检测 "trailing-comma": [true, {

效果echarts vue中国地图封装<template> <div class="echarts"> <div :style="{height:'400px',width:'100%'}" ref="myEchart"></div> </div></template><script>import echarts from 'echarts'// import '../../node_mod

效果echarts 折线图vue封装<template> <!--为echarts准备一个具备大小的容器dom--> <div class="line" :id="Line" :style="{height:'100%',width:'100%'}" /></template><script>import echarts from 'echarts'export default { name: 'Line', pro

效果echarts 柱状图vue封装<template> <div class="bar" id="bar" /></template><script>// 自行引入echartsimport echarts from 'echarts'export default { name: 'Bar', // 接收从父组件传回的值 props: ['getData'], data () { return {} },

效果图vue封装echarts饼图<template><!--为echarts准备一个具备大小的容器dom--><div class="pie" :id="pie" :style="{height:'100%',width:'100%'}" /></template><script>// 自行导入echartsimport echarts from 'echarts'export default { name: 'pie

vue 导出excel （公共方法）// 导出文 -resexport function handleExp (res) { // 获取导出文件名称 const file = store.state.headerContent const filename = file['content-disposition'].split(';')[1].split('filename=')[1].split('"')[1] || file['content-disposition'].split(';

富文本无法编辑：可能造成的原因：tinymce在modal前创建了，所以导致这个问题，解决方案就是用 v-if model弹出后是tinymce显示 <el-dialog :visible.sync="dialogFormVisible" > <tinymce v-model="form.content" :height="300" v-if="dialogFormVi...

<template> <div class="customer-servce"> <div class="imServer-wrapper"> <main class="imServer-main"> <im-record class="item im-record" ...

1.项目目录2.项目部分组件—-router/router.js ** * 路由引入 * const * => () => import('src/view/...') * */const LoginPage = () => import('@/view/LoginPage')/** * 路由注册 * '//注释信息' * { * ...

1.起步 创建webpack_demo文件夹（名称必须是webpack_demo） cmd (打开命令行) cd webpack_demo (进入webpack_demo) npm install --save-dev webpack (下载webpack) npm init (初始化webpack,没有特殊要求，一路默认，会自动生成package.json文件)...

一.下载1. npm i vue-i18n -D //i是install缩写 --save-dev -D是--save-dev的缩写 （优点：用于开发环境，减少打包大小， 写入devDependencies ） 2. npm i vue-i18n -S //-S是--save的缩写（用于生产环境， 写入dependencies) 二.使用1.main.js中...

Vue-cli生成的项目，使用webpack打包，会打包成一个html页面和一个js文件，导致页面首次加载非常的慢，为了解决这个问题，使用异步组件，将他打包成多个js文件，优化首次加载页面速度，采用了异步加载，什么时候需要什么时候加载。使用：（router.js）before(不优化): import Login from '@component/login'// 方法一:later...

一、下载npm install --save二、引入(在main.js中操作)import Vue from 'Vue'import Vuex from 'Vuex'import Vuex from 'Vuex'三、注册（在main.js中操作）Vue.use(Vuex)四、使用1.state属性的使用（一般用于保存初始化状态） eg: ...

1.打开config/index.js文件module.exports = { dev:{ } }2.在dev中找见proxyTable {} module.exports = { dev:{ proxyTable:{ '/api': {...

Query String Parameters当发起一次GET请求时，参数会以url string的形式进行传递。即?后的字符串则为其请求参数，并以&作为分隔符。如下http请求报文头：General Request URL: http://login?uname=dingding Request Method: GETQuery String Parameter...

前端发布vue项目-linux（window系统打包项目到linux服务器）下载xshell(用于在window系统操作linux系统)下载xftp(用于在window系统上传下载文件)常用命令1.cd / （进入根目录）、cd /home(进入home文件夹)2.ls(查看目录下的所有文件)3.pwd(查看所在目录的路径)4.scp(用与在linux系统拷贝文件)5.ls...

1.V-Lazy的使用npm install vue-lazyload --save // 首先下载vue-lazyload插件// 在main.js中注册importVueLazyload from 'vue-lazyload'Vue.use(VueLazyload, {error:'dist/error.png',//这个是请求失败后显示的图片loading:'dist/...