诚的博客

npm set strict-ssl false npm config set registry http://registry.npmjs.org/

//判断属性是否存在if (!this.user.age) { //参数：对象，要添加的属性名，属性值 this.$set(this.user, "age", 20)} else { this.user.age = 20}

// d1, d2是后端传过来的日期字符串compareDate (d1, d2) { let reg = new RegExp('-', 'g') return ((new Date(d1.replace(reg, '/'))) > (new Date(d2.replace(reg, '/'))))}

情景介绍　　服务器上80端口已部署一套vue项目，现在乃至未来还可能要部署n个前端项目，而已部署的项目的nginx的配置不能修改项目配置　　假设需要部署的第二个vue项目是放在服务器的 “project” 目录下　　打包环境：　　　　　1、os：Windows10　　　　　2、node: v12.19.0　　　　　3、vue-cli3　　　　　4、vue:2.3.10 第一步 将vue.config.js里的publicPath 设置为‘'/proje...

在main页面全局开启发送cookie//main.js axios.defaults.withCredentials=true //开启发送cookie

请求的header匹配以下不安全字符时，将被终止，具体参考如下： Accept-Charset Accept-Encoding Connection Content-Length Cookie Cookie2 Content-Transfer-Encoding Date Expect Host Keep-Alive Referer TE Trailer Transfer-Encoding Upgrade User-Agent Via

第一步：封装cookie//设置cookieexport function setCookie(c_name, value,expire) { var date = new Date() date.setSeconds(date.getSeconds() + expire) document.cookie = c_name + "=" + escape(value) + "; expires=" + date.toGMTString()}//获取cookieexport f

1.首先需要创建config.js，注意，文件需要最好放在static目录下，这样配置文件回味与打出来的dist包的最外层，方便二次配置操作。 其次，编辑内容：window.appConfig = { baseURL: 'http://www.baidu.com.cn/',} 做完了配置操作之后，还需要在index.html中配置如下内容，这样可以做到配置文件的刷新操作：<script>document.write('<script src="./stati...

<textarea>默认是可以拖动的 ，如果需要设置不可拖动，只需添加resize: none; 即可。代码：<textarea name="" rows="" cols="" style="resize: none;"></textarea>

按照水平居中、垂直居中、行内元素、块级元素等条件进行组合获取效果水平居中：行内元素解决方案只需要把行内元素包裹在一个属性display为block的父层元素中，并且把父层元素添加如下属性即可：.parent { text-align:center;}水平居中：块状元素解决方案.item { /* 这里可以设置顶端外边距 */ margin: 10px auto;}水平居中：多个块状元素解决方案将元素的display属性设置为inline-block

效果图主要思路textarea限制最大长度 监控输入字数源代码html: <div id="main-container"> <div class="textarea"> <textarea maxlength="200" @input="monitorInput" v-model="textareaContent"></textarea> <span class="numLimit.

文本框CSS.textarea-style{ border:1px solid #000001; border-radius:5pt; height:60pt; font-size:10pt; margin-bottom: 2vh; width:100%; color: #000001; overflow-x:hidden; text-indent:20px}HTML<textarea id="handledMsg".

1、<el-form-item label="备注" prop="memo" style="display:block"> <el-input type="textarea" v-model="updateDiseaseForm.memo" class="wh462" placeholder="描述当前疾病史备注情况" maxlength...

<el-form-item label="活动形式"> <el-input type="textarea" :rows="2" v-model="form.desc"></el-input></el-form-item><el-col style="width: 200px"> <el-input type="textarea" .

<i class="el-icon-success" v-if="!scope.row.cat_deleted" style="color:lightgreen;"></i><i class="el-icon-success" :style="{color:iconColor}" @click="onColorChange" />data: { iconColor: 'red',}methods: { onColorChange() { ...

Element-ui一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库，在Vue中使用是很方便的。关于引用icon（第三方），有一种不用下载项目到本地的方法，前言element自带的有icon，使用起来也很方便。但是美中不足的是，官方提供的图标库只是部分，在需要新的icon时，我就想到了引入第三方icon。对我来说，阿里的icon库就很方便，之前的项目也是用的这个库。先是查看了Element官方文档，没发现有提示如何引用第三方icon，就尝试Google一下教程。这.

1、 什么是CSS预处理器CSS 预处理器用一种专门的编程语言，进行 Web 页面样式设计，然后再编译成正常的 CSS 文件，以供项目使用。CSS 预处理器为 CSS 增加一些编程的特性，无需考虑浏览器的兼容性问题。CSS预处理语言有SCSS (SASS) 和LESS等等，总之都是用来实现样式的。2、lang因此lang的属性可选：scss（sass）、less等等即：<style lang="scss">3、scss和sass的区别scss是sass的一个升级版本，两者都是用来实现样式

如图中的是jquery实现的，那么在vue中如何实现呢？结合自己的项目进行了整合，具体的额模块代码如下所示：第一步新建组件js建个JS文件，随便取个名字，把下面的js复制进去，我这里叫moreSlideComponents，因为我要实现的是点击【更多】按钮时如上图所示的样式。/** 这是一个vue 点击按钮 向上滑动展开的效果组件 例如综合查询接处警的更多条件* */const elTransition = '0.3s height ease-in-out, 0.3s padding-

button是一个行内块级元素display:inline-block;所以处理方式很简单，可以用以下两种方式：方式一：<div style="text-align:center"> <button>按钮居中</button> </div>方式二：<div> <button style="display:block;margin:0 auto">按钮居中...

<el-button type="text" style="margin-left:600px;color: #8cc5ff;text-decoration: underline;" @click="isActive=!isActive"> {{isActive ? "Less Conditions" : "More Conditions"}} <i :class="isActive ? 'el-icon-arrow-up' : ..

例如：想给图片增加高度和宽度<el-image :class="classRotation" v-if="imageData.src !== undefined" :src="imageData.src" :style="imageStyle"></el-image>//在data中声明 imageStyledata(){ return{ imageData:{}, imageStyle :{}, //样式...

第一种方式：申明全局变量，改变this方法。在对应的组件中申明全局变量在beforeCreated申明周期中修改this的指向，并在filters中使用。就可以获取data中申明的options数组的值第2种方式：可以直接给filter传递参数。<div> <el-table-column label="文章类型"> <template slot-scope="scope">{{ scope.row.type|formatT...

官方文档提供的event事件 在代码中绑定事件 在methods中写方法 好了，这样就可以实现了。

引用: npm install --save vue-pdftemplate代码:<template> <div class="pdf" v-show="fileType === 'pdf'"> <p class="arrow"> // 上一页 <span @click="changePdfPage(0)" class="turn" :class="{grey: currentPage==1}">Preview&l

文件、图片在后端主要以两种方式存储：1.保存在服务器上，数据库中存储的是该文件、图片的地址；2.将文件、图片转为二进制流，数据库中存储的是对应的二进制流。针对第一种情况的话，直接请求接口获取到对应的URL地址，赋值给src即可。第二种的话需要转换一下，请求接口获取的是二进制流，在控制台看到的会是一堆乱码，由于responseType默认返回的是json数据，需要将它转为blob对象，然后使用blob的API生成临时的URL地址，来显示对应的文件、图片。实现代码：1.在请求接口

这里以 vue-cli3 为例子，在pubilc目录下引入html就行了如果需要查看的可用下面的方法 1 window.open(`/ssh-terminal-template/index.html)

使用vue忙碌的开发了几个月的项目，最近终于得以喘息。现在把开发中的问题，总结一下。方便以后观看。1.vue项目中何时使用v-html标签绑定数据？当你的数据中有html元素标签，并且希望按照元素标签的样式显示的时候，这个时候就需要使用v-html来绑定数据。例子：js代码部分：export default { data () { myMess: '<h1> Hello World!</h1>' }}html代码部分：...

1、接口请求的时候一定要加responseType: 'blob',否则生产的文件会是空白（PDF）2、代码实现 const binaryData = [] binaryData.push(res)// res 后台返回的流数据 this.pdfUrl = window.URL.createObjectURL(new Blob(binaryData, { type: 'application/pdf' })) window.open(t...

项目后端为springboot，前端为vue后端在mysql数据库直接存储要下载的信息，mediumtext类型。需求：前端列表明细行有下载按钮，点击按钮时，通过Post请求拿到下载信息，并下载。 1 download({ id: row.id }).then(response => { 2 const blob = new Blob([response.data]) 3 const link = document.createElement(‘a‘) 4

一:问题工作中碰到的问题，在处理接口返回的验证码图片时，由于返回的是encode编码代码，在js端获取到数据之后，通过函数encodeURI()来进行解码，之后可以通过在src中设置来实现图片显示：<img src="data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAAoCAIAAAC6iKlyAAAFL0lEQVR42u3Zb2hXVRgH8EsbGoNe%0D%0ABJWmKeGcL1TajKGbmlGjjAWDRstQ7IWoc%2B

1.第一种方法（blob转url）2.第二种方法（blob转base64）

使用FileReader 对象转换：File => DataURL该对象用于读取文件（读取单个对象文件，所以，不能直接读取 Filelist 对象文件集合），即把文件内容读入内存。它接收 File 对象或 Blob 对象，作为参数。生成该对象的构造函数方法如下： var reader = new FileReader(); // 参数为 Blob 对象或 File 对象对于不同类型的文件，FileReader 使用不同的方法读取。方法如下：readAsBinaryStri

本文思路是把HTML请求以来，以v-html的形式加载到页面内部。注册全局组件【v-html-panel】1.HtmlPanel.vue文件 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27

参考方案一作为一个兼职前端和运维的java程序员，今天我司测试人员提出了一个需求，当后台服务地址ip地址改变后，webpack打包的VUE项目得更改地址重新打包，太麻烦了，最好可以读取外部配置文件的域名，灵活部署。　　这不是在刁难我胖虎吗，后来我在网上查资料，发现有解决思路，具体详细的解决方案没有，在和前端同事研究后，解决了该问题，现记录一下，供大家遇到此问题时参考。　　我司的前端项目我是用nginx部署的，原配置文件prod.env.js代码如下：　　module.exports =

// 安装插件npm install leafletnpm install @supermap/iclient-leafletnpm install leaflet-draw// 使用的vue文件中导入插件import L from 'leaflet';import '@supermap/iclient-leaflet';import 'leaflet-draw'

npm i webpack-dev-server -D把这个工具安装到项目本地开发依赖注意：webpack-dev-server 这个工具依赖 webpack，必须在本地(项目中)安装 webpack安装完成后，执行命令npm run dev发现报错：Error: Cannot find module 'webpack-cli/bin/config-yargs’后来查看一些资料，发现，webpack3.x的版本与webpack-dev-server3.x的版本不兼容。在packag...

vue 项目 npm run dev 运行时报错：npm ERR! xxx@1.0.0 dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js原因：新版的webpack-dev-server 3.1.14 存在问题。解决方法：package.json 中指定 webpack-dev-server 低版本号方法1：“webpack-dev-server”: “^2.9.1”删除 nod.

如题，在项目中，经常有些函数和变量是需要复用，比如说网站服务器地址，从后台拿到的：用户的登录token,用户的地址信息等，这时候就需要设置一波全局变量和全局函数 定义全局变量 原理：设置一个专用的的全局变量模块文件，模块里面定义一些变量初始状态，用export default 暴露出去，在main.js里面使用Vue.prototype挂载到vue实例上面或者在其它地方需要使用时，引入该模块便可。全局变量模块文件：Global.vue文件：<script>con

var jsonObject = JSON.parse(‘JSON格式字符串’)

需要为元素配置ref属性 <template><!-- 普通的HTML元素 --><div class="id_container" ref='id_container'> <!-- element-ui框架的元素 --> <el-button type='text' ref="elButton">el按钮</el-button></div></template>2.在js...