Maggieq8324的博客_Vue

Vue - props属性

(目录) 前言 props用于接收来自父组件的数据具体应用基本使用 App.vue <template> <Test :url="url"/> </template> <script> import Test from './components/test.vue' export default

props

Vue

属性传值

数据

javascript

原创 2021-09-17 10:59:57 399 阅读

Vue - 加载静态图片的方式

(目录) 前言记录下Vue3.0中加载静态图片的方式加载静态图片 <img class="top-theme" src="./assets/home/theme1.jpg"> require加载图片 <img class="top-theme" :src="require('./assets/h

Vue

加载图片

加载

javascript

原创 2021-09-17 10:59:22 1336 阅读

Vue - 视图组件切换的方案

(目录) 前言 Vue中切换视图组件的方案大致有三种 1、roure-view 适合大幅度视图切换 2、v-if 适合小幅度组件切换 3、component 动态组件 roure-view 切换视图组件这个不多说了，之前的文章记录：Vue - route路由跳转 v-if 切换视图组件这个比较简

component

Vue

视图切换

javascript

原创 2021-09-17 10:58:56 785 阅读 1收藏

Vue - route路由跳转

(目录) 前言 vue中的route实现了从一个页面跳转到另一个页面的功能基本路由跳转 router.js import { createRouter, createWebHashHistory } from 'vue-router' import Home from '../views/home

Vue

自定义

事件监听

自定义事件

嵌套

原创 2021-09-17 10:58:27 839 阅读

Vue - 使用keep-alive缓存组件状态

(目录) 前言 keep-alive是vue提供的用来缓存组件状态的代码示例 keep.vue <template> <div>KeepAlive</div> <input /> </template> <script> export default { name: 'Keep' } </scri

keep-alive

Vue

缓存

代码示例

数组

原创 2021-09-17 10:57:03 193 阅读

Vue3.0 - vuex全局状态管理

(目录) 前言 vuex是vue的全局状态管理模式，定义在vuex中的值可在整个项目的组件中使用具体使用定义Vuex全局变量安装 npm install vuex --save 初始化store/index.js import { createStore } from 'vuex' expor

vuex

Vue

全局变量

数据

edn

原创 2021-09-17 10:40:08 2295 阅读

Vue3.0 - 双向数据绑定

(目录) 前言双向数据绑定的核心：实现响应式对象，这里介绍两种响应式数据的声明方式：ref与reactive ref ref包装基础类型 <body> <div id="app"> <div>{{number}}</div> <div v-on:click="onClick">onClick</d

reactive

ref

Vue

数据绑定

响应式

转载 2021-09-14 12:20:05 783 阅读

Vue - 指令

(目录) 前言记录下vue中的一些基础指令。具体使用基础代码，以下示例变量均使用setup()函数初始化变量 const {createApp} = Vue; const message = "hello, world"; const app = { // 入口函数 setup() { ret

Vue

html

初始化

数据

javascript

原创 2021-09-14 12:19:36 153 阅读

Vue3.0 - 项目初始化的两种方式

(目录) 前言最近将vue升级到了3.0，记录下3.0 下项目初始化的两种方式 cli 脚手架升级 node.js版本 vue-cli 卸载（对应vue2.0）（如果之前安装的是2.0版本，需要执行该操作卸载后升级，如果没有安装过跳到下一步直接安装） npm uni -g vue-cli vue/

vite

cli

Vue

初始化

创建项目

转载 2021-09-14 12:17:31 723 阅读

Vue3.0 - computed函数

(目录) 前言 computed计算属性，与普通JS函数相比computed性能更好，以为它存在计算缓存，js函数没有，其计算结果是只读的，可通过set方法修改。 computed的基本用法 <body> <div id="app"> <input v-model="firstName" type=

computed

Vue

get方法

js函数

javascript

转载 2021-09-14 12:16:37 1135 阅读

RSA分段解密 - Vue

前言上一篇文章实现了 Java RSA的分段加解密，这里我们介绍在 Vue 项目中如何使用 RSA 分段解密，这里的加解密场景是：后端私钥分段加密 - 前端公钥分段解密前端如何使用公钥解密这里不做重复叙述，注重点是分段解密，有需要的参考之前的文章：RSA加密 - Vue 附上其他链接： RS

RSA

Algorithm

java

数组

i++

原创 2021-07-27 14:55:00 1279 阅读

vue导出pdf

环境 vue3.4.0 依赖 npm install --save html2canvas #html转换为图片 npm install jspdf --save #图片生成pdf 工具类 export-pdf.js import html2canvas from 'html2canvas' imp

Vue

html

边距

2d

工具类

原创 2020-12-19 14:57:00 240 阅读

SpringBoot+Vue实现Excel导出

环境 SpringBoot 1.5.20 Vue 2.5.2 SpringBoot 依赖  <dependency> <groupId>org.apache.poi</groupId> <artifactId>poi-ooxml</artifactId> <version>4

Vue

SpringBoot

文件流

spring

i++

转载 2020-07-27 23:29:00 642 阅读

vue 获取字符串日期间的差值

``` /** * 获取当前日期 * @returns {string} * @Example getNowTime('-') */ getNowTime(str){ let nowDate = new Date(); let y = nowDate.getFullYear(); let m = nowDate.getMonth() + 1 < 10 ? "0" + (nowDate.getMon

Vue

字符串

当前日期

javascript

原创 2020-04-14 22:46:00 90 阅读

VUE中展示代码

CodeMirror 是一款在线代码编辑器，本篇文章只记录展示代码，无在线编辑模块安装 main.js引入如下所示，安装后，在目录下有许多主题，挑选中意的即可组件封装组件引用效果图注意：在使用时想要高度自适应，需要修改文件中的样式为高度自适应 .end

Vue

css

python

高度自适应

ide

转载 2020-04-07 22:49:00 585 阅读

数组排序

注：排序为升序排列，这种方法会改变原始数组

Vue

i++

插入排序

javascript

升序

原创 2020-02-15 21:54:00 47 阅读

el-table表格高度自适应

<el-table stripe ref="table" :data="table.tableData" border size="mini" :height="table.tableHeight" :header-cell-style="{'text-align':'center'}" :cell

Vue

javascript

窗口大小

原创 2020-02-15 21:43:00 497 阅读

Vue实现PC端分辨率自适应

方案 + ：阿里可伸缩布局方案：转安装依赖引入依赖引入 px转换成rem 的和其他样式文件最终是都是由里的方法生成的，我们只需在后再加上一个即可，的选项意思是 1rem=多少像素，结合的方案，我们将的设置成设计稿宽度的，这里假设设计稿宽为中添加放进loaders数

Vue

css

数组

缩放比例

分辨率适配

原创 2019-12-25 22:11:00 654 阅读

vue2.5 + element UI el-table 导出Excel

安装依赖新建excelHelper.js 目录下新建文件调用在需要使用导出的页面中引用按钮调用其中，是为表格绑定的id，是导出的文件名称，是导出的文件类型，指明导出的内容只做解析不进行格式转换填坑指南 el table数据导出Excel数据重复两遍原因：el table的fi

Vue

数据

文件类型

格式转换

javascript

原创 2019-12-16 21:20:00 331 阅读

VUE Base64编码图片展示与转换图片

图片的 base64 编码就是可以将一副图片数据编码成一串字符串，使用该字符串代替图像地址，使用 base64 传输图片文件可以节省一个 http 请求，图片的 base64 编码可以算是前端优化的一环 VUE Base64编码图片展示图片在线转换Base64： "http://imgbase64

Vue

ico

chrome

上传

字符串

原创 2019-09-24 12:39:00 903 阅读

[Vue warn]: Invalid prop: type check failed for prop

属性是Dialog弹窗中定义是否为全屏 Dialog的属性，element 官方文档中默认值是false ，于是加入是对其赋值 true，然后报了下面的错误：解决办法：实际上并不用加 true，直接写就行，类似于属性一样，element中的很多属性其实不用定义值为或，希望看到这篇博文的人有

Vue

赋值

默认值

全屏

javascript

转载 2019-09-19 12:40:00 498 阅读 1点赞

VUE Error: listen EADDRNOTAVAIL: address not available

vue项目运行npm run dev时出现 Error: listen EADDRNOTAVAIL: address not available ... 的错误原因：配置的IP不对解决方法：打开文件夹，找到文件，将的值修改为 , 如下图所示:

Vue

解决方法

javascript

转载 2019-09-18 12:56:00 832 阅读

print.js继承原有样式

npm install save print js import Print from 'print js' 调用print.js插件

Vue

js插件

html

javascript

转载 2019-09-11 13:44:00 209 阅读

vue项目集成金格WebOffice2015

下载官网地址： "http://www.goldgrid.com/jinge_download/index.aspx?num=5" 解压后的文件 js文件中有两个重要的js文件和是WebOffice2015对象的一些方法。是根据不同的浏览器环境来渲染 iWebOffice2015.js We

Vue

chrome

html

控件

自定义

原创 2019-08-27 10:43:00 611 阅读

Vue项目搭建

Vue 是一套用于构建用户界面的渐进式框架,本篇博客讲述如何搭建一个基础的Vue项目开发环境系统环境：windows10 开发工具：Visual Studio Code或HBuilderX或IDEA，根据个人喜好选择 Node JS Node JS Node JS是一个JavaScript 运行

Vue

根目录

ide

开发工具

javascript

转载 2019-08-26 20:32:00 142 阅读

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯

51CTO博客

mb613065fc9cd11的博客

Vue - props属性

Vue - 加载静态图片的方式

Vue - 视图组件切换的方案

Vue - route路由跳转

Vue - 使用keep-alive缓存组件状态

Vue3.0 - vuex全局状态管理

Vue3.0 - 双向数据绑定

Vue - 指令

Vue3.0 - 项目初始化的两种方式

Vue3.0 - computed函数

RSA分段解密 - Vue

vue导出pdf

SpringBoot+Vue实现Excel导出

vue 获取字符串日期间的差值

VUE中展示代码

数组排序

el-table表格高度自适应

Vue实现PC端分辨率自适应

vue2.5 + element UI el-table 导出Excel

VUE Base64编码图片展示与转换图片

[Vue warn]: Invalid prop: type check failed for prop

VUE Error: listen EADDRNOTAVAIL: address not available

print.js继承原有样式

vue项目集成金格WebOffice2015

Vue项目搭建